/* Xiao Guang, HCF's opt-in website guide. Components are isolated from the site's utility classes. */
#hcf-guide {--hg-ink:#23263a;--hg-muted:#656a7c;--hg-paper:#ffffff;--hg-line:#e5e6ed;position:fixed;right:22px;bottom:22px;z-index:85;font-family:'Inter','Noto Sans TC',sans-serif;color:var(--hg-ink);font-size:14px;line-height:1.6;isolation:isolate;}
#hcf-guide *,#hcf-guide *::before,#hcf-guide *::after {box-sizing:border-box;text-shadow:none;}
#hcf-guide [hidden] {display:none!important;}
#hcf-guide button,#hcf-guide a {font:inherit;letter-spacing:normal;text-transform:none;cursor:pointer;-webkit-tap-highlight-color:transparent;}
#hcf-guide button {border:0;}
#hcf-guide a {text-decoration:none;color:inherit;}
#hcf-guide :focus-visible {outline:3px solid #695de5;outline-offset:4px;}
#hcf-guide .hg-launch {display:flex;flex-direction:column;align-items:center;position:relative;width:100px;background:transparent;padding:0;color:var(--hg-ink);}
#hcf-guide .hg-art {position:relative;display:block;width:100px;height:110px;filter:drop-shadow(0 8px 9px #6552ab20);animation:hg-float 4s ease-in-out infinite;}
#hcf-guide .hg-art img {display:block;width:100%;height:100%;object-fit:contain;transform:perspective(350px) rotateY(var(--hg-look,0deg));transition:transform .2s;user-select:none;pointer-events:none;}
#hcf-guide .hg-launch-label {display:block;margin-top:-5px;padding:5px 13px;border:1px solid #e2deed;border-radius:24px;background:#ffffffed;box-shadow:0 4px 16px #2522390c;font-size:11px;font-weight:600;color:#34364c;white-space:nowrap;}
#hcf-guide .hg-launch:hover .hg-launch-label {border-color:#bfb5ed;}
#hcf-guide .hg-rest {border:1px solid #cfcbdc;border-radius:30px;background:#fffffff2;box-shadow:0 4px 20px #1d214214;color:#44485d;font-size:12px;padding:10px 15px;}
#hcf-guide .hg-panel {position:absolute;right:0;bottom:145px;width:348px;max-height:calc(100svh - 277px);overflow:auto;overscroll-behavior:contain;background:var(--hg-paper);border:1px solid var(--hg-line);border-radius:22px;box-shadow:0 20px 80px -20px #1d254445,0 2px 8px #1d254409;color:var(--hg-ink);}
#hcf-guide .hg-panel::before {content:'';display:block;height:3px;background:linear-gradient(90deg,#5668e8,#bf8bdc,#f399b6,#f7d886,#8de0d3);}
#hcf-guide .hg-panel-top {display:flex;align-items:center;gap:9px;padding:15px 19px 12px;border-bottom:1px solid var(--hg-line);}
#hcf-guide .hg-dot {width:7px;height:7px;background:#8271db;border-radius:50%;box-shadow:0 0 0 4px #8271db10;}
#hcf-guide .hg-name {font-size:13px;font-weight:700;color:var(--hg-ink);}
#hcf-guide .hg-name small {font-size:10px;letter-spacing:.02em;margin-left:7px;color:var(--hg-muted);font-weight:400;}
#hcf-guide .hg-close {margin-left:auto;width:32px;height:32px;border-radius:50%;background:transparent;color:var(--hg-muted);font-size:22px;line-height:1;}
#hcf-guide .hg-close:hover {background:#8271db0d;}
#hcf-guide .hg-content {padding:21px 21px 20px;}
#hcf-guide .hg-eyebrow {display:block;color:var(--hg-muted);font-size:10px;letter-spacing:.13em;margin-bottom:9px;font-weight:500;}
#hcf-guide .hg-title {margin:0 0 10px;padding:0;font-size:23px;line-height:1.48;letter-spacing:-.035em;font-weight:700;color:var(--hg-ink);}
#hcf-guide .hg-copy {font-size:13px;color:var(--hg-muted);line-height:1.85;margin:0 0 19px;}
#hcf-guide .hg-options {display:grid;gap:8px;}
#hcf-guide .hg-option {display:flex;align-items:center;gap:12px;text-align:left;width:100%;padding:13px 12px;background:transparent;border:1px solid var(--hg-line);border-radius:12px;color:var(--hg-ink);transition:background .2s,border-color .2s;}
#hcf-guide .hg-option:hover {background:#8170df0a;border-color:#b8aedc;}
#hcf-guide .hg-option b {display:block;font-size:13px;font-weight:600;}
#hcf-guide .hg-option small {display:block;color:var(--hg-muted);font-size:11px;margin-top:2px;}
#hcf-guide .hg-option i {font-style:normal;margin-left:auto;color:var(--hg-muted);font-size:20px;line-height:1;}
#hcf-guide .hg-option-num {font:10px 'JetBrains Mono',monospace;color:#8e82bc;}
#hcf-guide .hg-primary {display:flex;align-items:center;justify-content:space-between;gap:12px;background:#303349;color:#fff;padding:13px 15px;width:100%;border-radius:11px;font-size:13px;font-weight:600;}
#hcf-guide .hg-primary:hover {background:#4c496d;}
#hcf-guide .hg-back {display:inline-flex;align-items:center;color:var(--hg-muted);padding:3px 0 12px;font-size:12px;background:transparent;}
#hcf-guide .hg-price {font-size:28px;letter-spacing:-.045em;font-weight:600;margin:0 0 11px;color:var(--hg-ink);}
#hcf-guide .hg-price small {font-size:12px;font-weight:400;letter-spacing:0;margin-left:7px;}
#hcf-guide .hg-foot {display:flex;justify-content:space-between;gap:12px;padding:14px 19px;border-top:1px solid var(--hg-line);font-size:11px;color:var(--hg-muted);}
#hcf-guide .hg-foot button {padding:0;background:none;font-size:11px;color:var(--hg-muted);}
#hcf-guide .hg-foot a {text-decoration:underline;text-underline-offset:3px;}
#hcf-guide .hg-tour-nav {display:flex;gap:8px;align-items:center;}
#hcf-guide .hg-tour-prev {padding:13px;background:transparent;color:var(--hg-muted);white-space:nowrap;font-size:12px;}
#hcf-guide .hg-tour-prev:disabled {opacity:.35;cursor:default;}
#hcf-guide .hg-tour-progress {display:flex;gap:5px;margin:0 0 18px;}
#hcf-guide .hg-tour-progress i {height:3px;flex:1;border-radius:4px;background:var(--hg-line);}
#hcf-guide .hg-tour-progress i.on {background:#9c8bcf;}
#hcf-guide .hg-greeting {position:absolute;right:112px;bottom:54px;background:var(--hg-paper);color:var(--hg-ink);padding:9px 15px;border-radius:16px 16px 3px 16px;border:1px solid var(--hg-line);box-shadow:0 8px 25px #33324610;font-size:12px;white-space:nowrap;}
#hcf-guide.is-waving .hg-art {animation:hg-wave .85s ease-in-out 1;}
.hg-tour-highlight {outline:2px solid #9b88de!important;outline-offset:8px!important;}
html.theme-dark #hcf-guide {--hg-ink:#f4f4fb;--hg-muted:#b0b1c3;--hg-paper:#222431;--hg-line:#3b3d50;}
body.mm-open #hcf-guide,body.lw-lb-open #hcf-guide,body:has(.xv.is-open) #hcf-guide,body:has(.pr-tray.is-open) #hcf-guide {visibility:hidden;pointer-events:none;}
body.hg-panel-open .hm-fab {visibility:hidden!important;pointer-events:none!important;}
body.pr-page #hcf-guide {right:auto;left:24px;}
body.pr-page #hcf-guide .hg-panel {right:auto;left:0;}
body.wi-in-gallery #hcf-guide {bottom:auto;top:150px;}
body.wi-in-gallery #hcf-guide .hg-panel {bottom:auto;top:138px;max-height:calc(100svh - 314px);}
body.wi-in-gallery #hcf-guide .hg-launch {width:78px;}
body.wi-in-gallery #hcf-guide .hg-art {width:78px;height:90px;}
@keyframes hg-float {0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-6px) rotate(1.5deg)}}
@keyframes hg-wave {0%,100%{transform:rotate(0)}25%,65%{transform:rotate(-9deg) translateY(-8px)}45%,85%{transform:rotate(6deg) translateY(-4px)}}
@media(max-width:767px){
  #hcf-guide {right:12px;bottom:calc(80px + env(safe-area-inset-bottom));}
  #hcf-guide .hg-launch {width:78px;}
  #hcf-guide .hg-art {width:78px;height:86px;}
  #hcf-guide .hg-launch-label {font-size:11px;padding:3px 9px;}
  #hcf-guide .hg-panel {position:fixed;left:12px;right:12px;bottom:calc(90px + env(safe-area-inset-bottom));width:auto;max-height:calc(100svh - 180px);}
  #hcf-guide .hg-content {padding:18px;}
  #hcf-guide .hg-title {font-size:22px;}
  #hcf-guide .hg-copy {font-size:13px;}
  #hcf-guide.is-open .hg-launch {visibility:hidden;}
  #hcf-guide .hg-greeting {right:88px;bottom:40px;font-size:11px;padding:8px 12px;}
  body.pr-page #hcf-guide {left:12px;right:auto;bottom:100px;}
  body.pr-page #hcf-guide .hg-panel {left:12px;right:12px;bottom:104px;}
  body.wi-in-gallery #hcf-guide {top:auto;bottom:98px;right:12px;}
  body.wi-in-gallery #hcf-guide .hg-panel {position:fixed;top:auto;bottom:88px;max-height:calc(100svh - 180px);}
}
@media(max-height:600px){#hcf-guide .hg-panel {position:fixed;top:84px;bottom:12px;max-height:none;}#hcf-guide .hg-art{height:66px;width:66px;}}
html.rm #hcf-guide *,html.rm .hg-tour-highlight {animation:none!important;transition:none!important;}
@media(prefers-reduced-motion:reduce){#hcf-guide * {animation:none!important;transition:none!important;}}
/* Keep the closing invitation and the original exploration control uncovered. */
@media(min-width:768px){body.ri-in-intro #hcf-guide{bottom:94px}body.ri-in-intro #hcf-guide .hg-panel{max-height:calc(100svh - 349px)}}
@media(max-width:767px) and (max-height:730px){
 body.ri-in-intro #hcf-guide{bottom:60px}
 body.ri-in-intro #hcf-guide .hg-art{width:68px;height:72px}
}

#hcf-guide[data-view="tour"] .hg-foot{display:none}
@media(min-width:768px){
 #hcf-guide[data-view="tour"]{left:24px;right:auto}
 #hcf-guide[data-view="tour"] .hg-panel{left:0;right:auto}
}
@media(max-width:767px){
 #hcf-guide[data-view="tour"] .hg-panel{bottom:16px;max-height:290px}
 #hcf-guide[data-view="tour"] .hg-panel-top{padding:8px 16px}
 #hcf-guide[data-view="tour"] .hg-content{padding:12px 16px}
 #hcf-guide[data-view="tour"] .hg-title{font-size:18px;margin-bottom:6px}
 #hcf-guide[data-view="tour"] .hg-copy{font-size:12px;line-height:1.75;margin-bottom:12px}
 #hcf-guide[data-view="tour"] .hg-tour-progress{margin-bottom:8px}
}
@media(max-height:600px){
 #hcf-guide .hg-panel,body.wi-in-gallery #hcf-guide .hg-panel,#hcf-guide[data-view="tour"] .hg-panel{position:fixed;top:84px;bottom:12px;max-height:none!important;height:auto}
}
@media(max-width:767px) and (max-height:730px){
 #hcf-guide:not([data-view="tour"]) .hg-panel-top{padding:9px 16px}
 #hcf-guide:not([data-view="tour"]) .hg-content{padding:14px}
 #hcf-guide:not([data-view="tour"]) .hg-eyebrow{font-size:9px;margin-bottom:6px}
 #hcf-guide:not([data-view="tour"]) .hg-title{font-size:20px;line-height:1.4;margin-bottom:7px}
 #hcf-guide:not([data-view="tour"]) .hg-copy{font-size:12px;line-height:1.75;margin-bottom:12px}
 #hcf-guide:not([data-view="tour"]) .hg-option{padding:9px 10px}
 #hcf-guide:not([data-view="tour"]) .hg-foot{padding:10px 16px}
}