@font-face { font-family: "Sentosa Brush"; src: url("fonts/calligraphy.woff2") format("woff2"), url("fonts/calligraphy.ttf") format("truetype"); font-weight: 400 750; font-display: swap }
:root {
  --berry: #c62153;
  --red: #d02759;
  --ink: #33343b;
  --heading: #464b5c;
  --line: #e3e2e5;
  --muted: #626370;
  --paper: #f7f7f9;
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box }
html { scroll-padding-top: 24px }
body { margin: 0; background: #fff }
a { color: inherit; text-decoration: none }
button,summary { font: inherit; color: inherit; cursor: pointer }
button { border: 0; background: none }
img { max-width: 100% }
a:focus-visible,button:focus-visible,summary:focus-visible { outline: 3px solid #2168bc; outline-offset: 3px }
button,input { font: inherit }
h1,h2,h3,p { margin: 0 }
[hidden] { display: none !important }
.wrap { width: min(1200px,calc(100% - 90px)); margin-inline: auto }
.ico { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.18em }
.skip { position: fixed; top: -100px; left: 15px; z-index: 40; background: white; color: var(--ink); padding: 10px }
.skip:focus { top: 10px }
.mast { color: white; position: absolute; inset: 0 0 auto; z-index: 5; background: linear-gradient(180deg,#1018259c,transparent) }
.head-row { display: flex; align-items: center; height: 70px; gap: 24px }
.wordmark { display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0 }
.mark { width: 40px; height: 40px; object-fit: contain }
.wordmark b,.wordmark small { display: block }
.wordmark b { font-size: 23px; line-height: 1.08; letter-spacing: .05em }
.wordmark small { font-family: Arial,sans-serif; font-size: 9px; line-height: 1.5; letter-spacing: .17em; font-weight: 600 }
.wide-nav { margin: 0 auto; display: flex; align-items: center; gap: clamp(18px,2.85vw,42px); white-space: nowrap }
.wide-nav a { font-size: clamp(15px,1.35vw,18px); padding: 12px 0; position: relative; text-shadow: 0 1px 6px #1115 }
.inside .wide-nav a[aria-current]:after,.wide-nav a:hover:after { content: ""; position: absolute; bottom: 4px; left: 23%; width: 54%; height: 2px; background: currentColor }
.head-contact { flex: none; white-space: nowrap; border: 1px solid currentColor; border-radius: 3px; padding: 9px 14px; font-size: 14px }
.mast.light { background: linear-gradient(#ffffffc4,#ffffff08); color: #382f39 }
.mast.light .wide-nav a { text-shadow: none }
.menu { display: none; position: relative }
.menu summary { list-style: none }
.menu summary::-webkit-details-marker { display: none }
.menu nav { position: absolute; top: calc(100% + 8px); right: 0; width: 180px; padding: 6px; background: white; color: var(--ink); box-shadow: 0 6px 28px #1113; border: 1px solid var(--line); border-radius: 5px }
.menu nav a { display: block; padding: 10px 15px }
.menu nav [aria-current] { background: #fff2f7; color: var(--berry) }

.carousel { position: relative; background: #455666; color: white; height: 550px }
.slide,.slide picture,.slide img,.banner-copy { width: 100%; height: 100%; position: absolute; inset: 0 }
.slide img { object-fit: cover; object-position: center }
.slide { overflow: hidden }
.banner-copy { display: flex; align-items: center; justify-content: center; text-align: center; padding: 47px 24px 12px }
.banner-copy h1,.banner-copy h2 { font-size: clamp(45px,4.55vw,83px); line-height: 1.18; font-weight: 750; letter-spacing: .035em }
.welcome h1,.stay h2 { font-family: "Sentosa Brush","Kaiti SC",KaiTi,STKaiti,"Songti SC","Noto Serif CJK SC",serif; font-weight: 700 }
.welcome .banner-copy,.stay .banner-copy { text-shadow: 0 2px 13px #15202dcc; background: linear-gradient(0deg,#10132a18,#121d2b33,transparent) }
.banner-copy p { margin: 14px auto 23px; font-size: clamp(16px,1.32vw,22px); letter-spacing: .08em; line-height: 1.5 }
.banner-copy p .ico { background: #598081a8; border-radius: 100%; padding: 2px; width: 22px; height: 22px; margin-right: 8px }
.slide-link { display: inline-flex; gap: 12px; align-items: center; justify-content: center; padding: 10px 30px; border-radius: 40px; line-height: 1.4; background: linear-gradient(105deg,#cd1758,#ef4829); box-shadow: 0 3px 8px #4c1a2733; color: white; font-weight: 650; text-shadow: none }
.slide-link:hover { filter: brightness(1.09) }
.guide .banner-copy { justify-content: flex-start; padding-left: 49%; text-align: left; color: #562f30 }
.guide h2,.green h2,.mobile h2 { font-size: clamp(40px,4vw,75px) }
.guide .slide-link { background: #821b34 }
.mobile .banner-copy,.green .banner-copy { justify-content: flex-start; padding-left: max(12%,calc((100% - 1050px)/2)); text-align: left; color: #103c40 }
.mobile .slide-link { background: #d65e1b }
.green .banner-copy { color: #246848 }
.green .slide-link { background: #34845b }
.slide-controls { position: absolute; bottom: 18px; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center }
.dot,.toggle { width: 34px; height: 29px; display: grid; place-items: center; padding: 0; color: #fff }
.dot:after { content: ""; width: 9px; height: 9px; border-radius: 100%; background: #a5a5a5; box-shadow: 0 0 2px #0003 }
.dot[aria-pressed=true]:after { background: white }
.toggle { position: absolute; left: 100%; opacity: .8 }
.toggle .ico { width: 14px; height: 14px }
.toggle .ico:last-child,.toggle[data-stopped] .ico:first-child { display: none }
.toggle[data-stopped] .ico:last-child { display: block }

.backdrop { position: relative; isolation: isolate }
.scene { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -1 }
.ruled { color: var(--heading); font-size: 28px; font-weight: 700; text-align: center; display: flex; justify-content: center; align-items: center; gap: 17px; line-height: 1.5 }
.ruled:before,.ruled:after { content: ""; width: 54px; height: 1px; background: linear-gradient(90deg,transparent,#a4a3a9) }
.ruled:after { transform: rotate(180deg) }
.overview { height: 860px; padding: 146px 20px 20px; background: #faf9f6 }
.overview .inner { text-align: center }
.rank,.rank>div,.glance,.glance>div { display: flex; justify-content: center; align-items: center }
.rank { margin-top: 59px; gap: clamp(100px,14vw,226px) }
.rank span { text-align: right; font-size: 40px; color: #62636a; font-weight: 550; line-height: 1.2 }
.rank small,.glance small { display: block; font-weight: 400; margin-top: 5px; font-size: 14px; letter-spacing: .05em }
.rank b { margin-left: 17px; font: 500 80px/1.05 Arial,sans-serif; color: var(--berry) }
.room-area-label { margin-top: 22px; color: #56565f; font-size: 14px }
.hotel-sources { display: flex; justify-content: center; gap: 18px; margin-top: 13px; font-size: 13px; color: #50515b }
.hotel-sources a { text-decoration: underline; text-underline-offset: 3px }
.glance { width: fit-content; max-width: 100%; margin: 6px auto 0; gap: 0; background: #ffffff72; border-radius: 32px; padding: 37px 30px }
.glance>div { padding-inline: clamp(18px,2.9vw,54px); font-weight: 550 }
.glance>div+div { border-left: 1px solid #c7c2c6 }
.glance b { font: 500 47px/1 Arial,sans-serif; color: var(--berry); padding-right: 10px }
.glance small { font-size: 12px; color: #666 }
.entry-buttons { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap }
.button,.contact-lines a,.contact-lines button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px 17px; border-radius: 5px; font-size: 15px; font-weight: 600 }
.button.account { color: white; background: linear-gradient(#357fc5,#1b60a5); box-shadow: 0 3px 0 #164a80,0 5px 10px #203e5f22 }
.button.official { color: #513801; background: linear-gradient(#ffe695,#f3bf46); box-shadow: 0 3px 0 #bb8d2d,0 5px 10px #503f1522 }
.button:hover,.contact-lines a:hover,.contact-lines button:hover { filter: brightness(1.045) }
.button:active,.contact-lines button:active { transform: translateY(2px) }

.services { min-height: 866px; background: #fff; padding: 117px 20px }
.wheel { width: 428px; height: 428px; position: relative; margin: 96px auto 0 }
.wheel-disc,.wheel-branches { position: absolute; inset: 0; width: 100%; height: 100% }
.branch { display: flex; align-items: center; position: absolute; width: clamp(268px,24vw,362px); color: #33343c }
.branch:nth-child(odd) { flex-direction: row-reverse }
.branch img { width: 100px; height: 100px; position: relative; z-index: 1 }
.branch span { border-bottom: 1px solid #bcb5ba; display: block; padding: 0 0 9px; flex: 1 }
.branch:nth-child(even) span { text-align: right }
.branch b,.branch small { display: block }
.branch b { font-size: 18px; font-weight: 550 }
.branch small { font-size: 13px; color: #666471; margin-top: 4px }
.branch:hover b,.foot-col a:hover,.foot-col button:hover,.related a:hover,.crumb a:hover { color: var(--berry) }
.branch-1,.branch-5 { right: 315px }
.branch-2,.branch-6 { left: 306px }
.branch-1,.branch-2 { top: 22px }
.branch-3,.branch-4 { top: 162px }
.branch-3 { right: 371px }
.branch-4 { left: 370px }
.branch-5,.branch-6 { top: 311px }
.network { padding: 120px 0 110px; min-height: 600px; background: #fafafa }
.directory { width: min(83vw,1595px,calc(100% - 100px)); margin-top: 121px; display: grid; grid-template-columns: repeat(7,1fr); gap: 8px }
.tile { min-height: clamp(50px,3.55vw,68px); display: flex; align-items: center; justify-content: center; gap: 7px; background: #fff; border: 1px solid #e9e7e6; box-shadow: 0 1px 4px #24303a08; transition: transform .2s,box-shadow .2s; }
.tile:hover { transform: translateY(-2px); box-shadow: 0 5px 12px #24303a1a }
.tile b,.tile small { display: block }
.tile b { font-size: 16px; letter-spacing: .04em }
.tile small { font: 8px/1.5 Arial,sans-serif; letter-spacing: .06em }
.tile .ico { width: 26px; height: 26px }
.tone-0 { color: #794647 }.tone-1 { color: #47644f }.tone-2 { color: #464154 }.tone-3 { color: #886436 }.tone-4 { color: #384566 }.tone-5 { color: #8e323e }.tone-6 { color: #355f69 }
.news-home { padding-block: 82px }
.news-home .news-bar { margin-top: 44px }
.news-bar { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 18px; color: var(--muted); font-size: 14px }
.news-bar h2 { font-size: 24px; color: var(--heading) }
.news-bar a { color: var(--berry) }
.story-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px }
.story-list article { padding: 23px; background: white; border: 1px solid var(--line); border-radius: 6px; box-shadow: 0 4px 12px #20233008; display: flex; flex-direction: column }
.story-top,.read-links { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 13px }
.story-top { color: var(--muted) }
.story-top span { color: var(--berry) }
.story-list h3 { margin: 13px 0 8px; font-size: 19px; line-height: 1.55 }
.story-list h3 a:hover { color: var(--berry) }
.story-list p { color: var(--muted); font-size: 15px; line-height: 1.8; margin-bottom: 20px }
.read-links { margin-top: auto; border-top: 1px solid var(--line); padding-top: 13px }
.read-links a:first-child { color: var(--berry) }
footer { border-top: 1px solid var(--line); background: #f6f6f6 }
.foot-grid { display: flex; justify-content: space-between; gap: 24px; padding: 73px 24px 36px }
.foot-col { display: flex; flex-direction: column; gap: 9px; align-items: flex-start }
.foot-col strong { color: #333; font-size: 16px; margin-bottom: 6px }
.foot-col a,.foot-col button { color: #65666a; font-size: 14px; padding: 0 }
.foot-numbers b { display: block; color: #1e1e1e; font-size: 22px; font-family: Arial,sans-serif; margin-left: 4px }
.footnote { text-align: center; padding: 15px; background: #eeeeef; font-size: 12px; color: var(--muted) }
.contact-dock { position: fixed; z-index: 8; right: 0; top: 47%; transform: translateY(-12%); background: white; border: 1px solid #e2dee1; border-right: 0; border-radius: 10px 0 0 10px; overflow: hidden; box-shadow: -2px 4px 16px #271a2b26 }
.contact-dock>a,.contact-dock>button { display: flex; gap: 6px; align-items: center; justify-content: center; flex-direction: column; width: 108px; min-height: 77px; padding: 9px 3px; text-align: center; background: linear-gradient(130deg,#fff 55%,#f5f3f5); color: #494451; font-size: 13px; line-height: 1.45 }
.contact-dock>*+* { border-top: 1px solid #ece9ed }
.contact-dock .ico { width: 21px; height: 21px; color: var(--berry) }
.contact-dock b { display: block; font: 650 13px/1.4 Arial,sans-serif; color: #3b343b }
.contact-dock .chat { color: var(--berry); font-weight: 600 }
.contact-dock a:hover,.contact-dock button:hover { background: #fff4f7 }
.toast:not(:empty) { position: fixed; z-index: 15; bottom: 30px; left: 50%; transform: translateX(-50%); padding: 11px 20px; border-radius: 6px; background: #34323b; color: white; font-size: 14px }

.inside .mast { position: relative; color: #3b3b44; background: #fff }
.inside .wordmark { color: var(--berry) }
.inside .wide-nav a { text-shadow: none }
.inside .wide-nav [aria-current],.inside .head-contact { color: var(--berry) }
.inner-body { max-width: 1200px; padding-bottom: 60px }
.crumb { display: flex; flex-wrap: wrap; gap: 10px; padding: 20px 0; font-size: 12px; color: var(--muted) }
.guide-body,.article-layout { display: grid; gap: 30px; align-items: start }
.guide-body { grid-template-columns: 180px minmax(0,1fr); gap: 25px }
.guide-body aside,.guide-sections { background: white; border: 1px solid #eee }
.guide-body aside a { display: block; position: relative; line-height: 50px; padding-left: 25px; font-size: 15px; border-bottom: 1px solid #f4f4f4 }
.guide-body aside a[aria-current],.guide-body aside a:hover { color: var(--berry) }
.guide-body aside a[aria-current]:before { content: ""; position: absolute; left: 0; top: 10px; height: 30px; width: 4px; background: #da004c }
.guide-sections { padding: 20px; min-height: 600px; box-shadow: 0 2px 5px #22222204 }
.guide-sections h1,.guide-sections h2 { font-size: 16px; line-height: 1.45; color: #151515; background: #eee; padding: 12px 20px; margin: 10px 0 }
.guide-sections h1 { margin-top: 0 }
.guide-sections p { padding-inline: 15px; text-indent: 28px; font-size: 14px; line-height: 28px }
.article-layout { grid-template-columns: minmax(0,3fr) minmax(200px,1fr) }
.article-body { color: #2d2f38; background: white; padding: 25px; border: 1px solid #eee }
.article-body h1 { font-size: 30px; font-weight: 600; margin: 0 0 14px; line-height: 1.5 }
.story-meta { color: #737582; font-size: 14px; line-height: 20px }
.article-topic { display: inline-block; margin-top: 12px; border-radius: 4px; color: #39506d; background: #e1e9f5; font-size: 12px; padding: 4px 9px }
.prose { margin: 17px 0 24px; font-size: 16px; line-height: 2; white-space: normal }
.related { border: 1px solid #eee; padding: 20px }
.related h2 { font-size: 16px; color: var(--berry); margin-bottom: 8px }
.related a { display: block; padding: 12px 0; line-height: 1.7; font-size: 14px; border-top: 1px solid #eee }
.source-links { display: flex; gap: 18px; border-top: 1px solid var(--line); padding: 17px 0; color: var(--berry); font-size: 14px }
.contact-block { margin: 38px auto 0; border: 1px solid var(--line); background: #faf9fa; border-radius: 7px; text-align: center; padding: 32px 15px; box-shadow: 0 4px 12px #20232d08 }
.contact-block h2 { font-size: 23px; color: var(--heading); margin-bottom: 20px }
.contact-lines { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px 28px; margin-bottom: 19px }
.contact-lines>div { display: flex; gap: 8px; align-items: center }
.contact-lines a,.contact-lines button { background: linear-gradient(white,#f3ebef); color: #782447; border: 1px solid #e8d8e0; box-shadow: 0 2px 0 #d4bcc7; font-size: 14px; padding: 6px 10px }
.not-found { padding: 30px 0 50px }
.back { color: var(--berry) }

.foot-codes { display: flex; align-items: flex-start; gap: 28px }
.foot-codes a { display: grid; justify-items: center; gap: 8px; font-size: 14px; color: #444 }
.foot-codes [data-qr] { display: block; width: 86px; height: 86px; background: #fff }
.foot-codes svg { display: block; width: 100%; height: 100%; shape-rendering: crispEdges }
.foot-codes small { font-size: 13px }
.news-heading h1 { font-size: 24px; color: var(--heading) }
.story-list .has-photo { display: grid; grid-template-columns: minmax(0,1fr) 86px; align-content: start; gap: 0 12px }
.story-photo { grid-column: 2; grid-row: 1 / 4; align-self: center }
.story-photo img { width: 86px; height: 107px; display: block; border-radius: 4px; object-fit: cover }
.has-photo .read-links { grid-column: 1 / -1 }
.overview-actions { margin-top: 24px }
.overview .ruled:before,.overview .ruled:after { display: none }
@media (min-width: 761px) {
  .welcome .banner-copy { padding-top: 22px; padding-bottom: 0 }
  .welcome h1 { font-size: clamp(65px,7.2vw,112px); line-height: 1.06; letter-spacing: .025em }
  .welcome .banner-copy p { font-size: clamp(21px,1.7vw,34px); margin: 8px 0 22px; font-weight: 550; color: #fff }
  .welcome .banner-copy p .ico { width: 1.4em; height: 1.4em; color: #96ffc1; border: 2px solid; border-radius: 50%; margin-right: 8px; background: #1e493852; vertical-align: -.3em }
  .welcome .slide-link { font-size: clamp(18px,1.5vw,29px); padding: 8px 24px; min-width: clamp(175px,15.2vw,292px); font-style: italic }
  .services .ruled,.network .ruled { line-height: 28px; gap: clamp(20px,3.2vw,62px) }
  .services .ruled:before,.services .ruled:after { width: min(28vw,420px); height: 12px; background: url("images/heading-rule.webp") center / 100% 12px no-repeat }
  .network .ruled:before,.network .ruled:after { width: min(32vw,630px); background: #ccc }
  .overview .ruled { line-height: 28px }
  .rank small { font-size: 16px }
  .branch { width: clamp(265px,27vw,460px) }
  .branch span { position: relative; border: 0; padding: 0 10px 11px }
  .branch span:after { content: ""; position: absolute; left: 0; bottom: 0; width: calc(100% + 22px); height: 12px; background: url("images/branch-rule.webp") center / 100% 12px no-repeat }
  .branch:nth-child(even) span:after { left: auto; right: 0; transform: scaleX(-1) }
  .branch b,.branch small { display: inline; line-height: 20px }
  .branch b { font-size: 16px }
  .branch small { margin-left: 7px; font-size: 14px; color: #57545c }
}
@media (min-width: 761px) and (max-width: 1430px) {
  .inner-body,.news-home { width: calc(100% - 192px) }
  .branch { width: clamp(235px,21vw,302px) }
}
@media (max-width: 1070px) {
  .wide-nav { display: none }
  .head-contact { margin-left: auto }
  .menu { display: block }
  .menu summary { display: grid; place-items: center; width: 36px; height: 36px }
  .menu summary .ico { width: 26px; height: 26px }
  .directory { grid-template-columns: repeat(4,minmax(0,1fr)) }
  .story-list { grid-template-columns: repeat(2,minmax(0,1fr)) }
  .services { min-height: 665px; padding-block: 85px }
  .wheel { transform: scale(.8); transform-origin: top center; margin: 62px auto -86px }
  .contact-dock>a,.contact-dock>button { width: 96px }
}
@media (max-width: 760px) {
  .wrap,.inner-body,.news-home,.directory { width: calc(100% - 36px) }
  body { padding-bottom: calc(65px + env(safe-area-inset-bottom)) }
  .head-row { height: 62px; gap: 10px }
  .mark { width: 34px; height: 34px }
  .wordmark { gap: 5px }
  .wordmark b { font-size: 20px }
  .wordmark small { font-size: 8px }
  .head-contact { font-size: 12px; padding: 5px 10px }
  .carousel { height: clamp(345px,85vw,480px) }
  .banner-copy { padding: 48px 18px 24px }
  .banner-copy h1,.banner-copy h2 { font-size: clamp(27px,7.7vw,46px) }
  .banner-copy p { margin: 11px 0 17px; font-size: 14px; letter-spacing: .02em }
  .slide-link { font-size: 14px; padding: 8px 20px }
  .guide .banner-copy,.mobile .banner-copy,.green .banner-copy { align-items: flex-end; justify-content: flex-start; padding: 0 22px 56px; color: white; text-shadow: 0 1px 4px #2226; background: linear-gradient(0deg,#26352ec9,transparent 83%) }
  .guide .banner-copy p,.mobile .banner-copy p,.green .banner-copy p { max-width: 270px }
  .slide-controls { bottom: 9px }
  .dot,.toggle { height: 27px; width: 25px }
  .ruled { font-size: 22px; gap: 9px }
  .ruled:before,.ruled:after { width: 27px }
  .overview { height: 490px; padding: 47px 12px 20px }
  .rank { margin-top: 26px; gap: clamp(10px,4vw,28px) }
  .rank span { font-size: 19px }
  .rank small { font-size: 10px }
  .rank b { font-size: clamp(36px,10.5vw,47px); margin-left: 8px }
  .glance { padding: 14px 9px; border-radius: 14px; gap: 9px 0; max-width: min(390px,100%); flex-wrap: wrap }
  .glance>div { padding-inline: clamp(4px,1.5vw,12px) }
  .glance b { font-size: 31px }
  .button { font-size: 14px; padding: 9px 13px }
  .services { padding: 48px 16px; min-height: auto }
  .wheel { width: auto; height: auto; margin: 24px auto 0; transform: none; max-width: 460px }
  .wheel-disc { display: none }
  .wheel-branches { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; position: static }
  .branch,.branch:nth-child(odd) { position: static; width: auto; display: flex; flex-direction: column; align-items: center; background: #ffffffbd; padding: 9px 5px 16px; border: 1px solid #eae8eb; border-radius: 8px }
  .branch img { width: 62px; height: 62px }
  .branch span,.branch:nth-child(even) span { text-align: center; border: 0; padding: 0 }
  .branch b { font-size: 16px }
  .branch small { font-size: 12px; line-height: 1.55 }
  .network { padding: 46px 0; min-height: auto }
  .directory { grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 26px }
  .tile { min-height: 58px }
  .news-home { padding-block: 43px }
  .news-home .news-bar { margin-top: 20px }
  .story-list { grid-template-columns: 1fr; gap: 12px }
  .story-list article { padding: 17px }
  .foot-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 12px; padding: 32px 0 }
  .contact-dock { display: grid; grid-template-columns: 1.1fr 1fr .9fr; top: auto; bottom: 0; right: 0; left: 0; transform: none; border: 0; border-top: 1px solid #e6dce1; border-radius: 0; padding-bottom: env(safe-area-inset-bottom); box-shadow: 0 -3px 13px #30253224 }
  .contact-dock>a,.contact-dock>button { width: auto; height: 64px; min-height: 0; gap: 4px; font-size: 12px; padding: 3px 1px }
  .contact-dock>*+* { border-top: 0; border-left: 1px solid var(--line) }
  .contact-dock .ico { width: 16px; height: 16px }
  .contact-dock b { font-size: 12px }
  .contact-dock .chat { flex-direction: row; background: linear-gradient(130deg,#cd2c60,#a51e50); color: #fff; font-size: 14px }
  .contact-dock .chat .ico { color: white }
  .toast:not(:empty) { bottom: calc(78px + env(safe-area-inset-bottom)); white-space: nowrap }
  .guide-body,.article-layout { grid-template-columns: 1fr; gap: 14px }
  .guide-body aside,.guide-sections,.article-body,.related { padding: 19px }
  .article-body { border: 0; padding: 4px 2px 15px }
  .article-body h1 { font-size: 18px; line-height: 30px }
  .prose { font-size: 14px; line-height: 28px }
  .guide-sections { min-height: 0 }
  .guide-body aside { display: grid; padding: 0; grid-template-columns: repeat(3,minmax(0,1fr)) }
  .guide-body aside a { line-height: 41px; text-align: center; padding: 0; font-size: 14px }
  .guide-body aside a[aria-current]:before { top: auto; bottom: 0; height: 2px; width: 100% }
  .guide-sections h1,.guide-sections h2 { padding: 9px 12px }
  .guide-sections p { padding-inline: 4px }
  .foot-codes { gap: 7px }
  .foot-codes [data-qr] { width: clamp(60px,15.5vw,82px); height: clamp(60px,15.5vw,82px) }
  .foot-codes small { font-size: 10px }
  .foot-numbers b { font-size: 17px }
  .story-list { background: #f4f5fa; padding: 12px; border-radius: 6px; gap: 15px }
  .story-list article { padding: 12px; border: 0 }
  .story-list h3 { font-size: 15px; line-height: 21px; margin: 8px 0 5px }
  .story-list p { font-size: 13px; line-height: 18px; margin-bottom: 10px }
  .story-list .story-top,.story-list .read-links { font-size: 12px }
  .glance { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 0 }
  .glance>div:nth-child(odd) { border-left: 0 }
  .overview-actions { margin-top: 13px }
  .contact-lines { display: grid; justify-content: center }
  .contact-lines>div { justify-content: center }
  .contact-block { padding-inline: 6px }
}
@media (prefers-reduced-motion: reduce) { *,*:before,*:after { transition-duration: 0s!important; scroll-behavior: auto!important } }