/* Final editorial layer: dark walnut, readable copy, quiet motion. */
:root { color-scheme: dark; --ease-out: cubic-bezier(.22,.61,.36,1); }
body.dialog-open { overflow: hidden; }
section[id] { scroll-margin-top: 8px; }
h1,h2,h3 { text-wrap: balance; }
p { text-wrap: pretty; }
button,a,summary { -webkit-tap-highlight-color: #c9aa7e25; }
a:active,button:active { opacity: .8; }
.desktop-nav { font-size: 13px; }
.header-book { font-size: 12px; }
.hero-bottom p { font-size: 15px; line-height: 2; }
.hero-cta { font-size: 14px; }
.hero-cta span:not(.sr-only) { font-size: 12px; }
.hero-content { padding-bottom: 150px; }
.hero { min-height: 900px; }
.hero-caption { font-size: 11px; }
.hero-location { font-size: 10px; }
.eyebrow { font-size: 11px; }
.section-kicker { font-size: 11px; }
.section-kicker>span:last-child { font-size: 13px; }
.small-copy { font-size: 14px; }
.source-note { font-size: 12px; }
.photo-caption { font-size: 11px; }
.text-link { font-size: 14px; }
.about-copy>p:first-child { font-size: 16px; }
.facts dd { font-size: 15px; }
.facts dt,.facts small { font-size: 11px; }
.spa-content>p:not(.source-note) { font-size: 15px; }
.ritual h3 { font-size: 18px; }
.ritual p { font-size: 13px; }
.section-heading p { font-size: 14px; }
.section-heading .text-link { font-size: 13px; }
.room-card { min-height: 365px; }
.room-name { white-space: normal; line-height: 1.6; }
.room-english { font-size: 10px; }
.room-tagline,.room-more { font-size: 12px; }
.room-number { margin-bottom: 38px; }
.room-card:focus-visible { position: relative; z-index: 1; background: #493629; }
.room-card:hover { transform: none; }
.room-card:hover .room-number { color: #ead0ac; }
.amenity-grid p { font-size: 13px; }
.amenity-icon { width: 38px; height: 38px; display: block; color: var(--gold); margin-bottom: 26px; }
.amenity-grid h3 { margin-top: 0; }
.button { font-size: 14px; }
.onsen-mark { display: flex; justify-content: center; }
.onsen-mark .amenity-icon { width: 34px; height: 34px; margin: 0; }
.reservation-inner>p:not(.reservation-note) { font-size: 15px; }
.reservation-note { font-size: 12px; line-height: 2.1; }
.secondary-booking { font-size: 13px; min-height: 44px; padding: 12px 2px; }
.sleep-copy p { font-size: 15px; }
.sleep-bottom .eyebrow { font-size: 10px; }
.sleep-bottom .source-note { font-size: 12px; }
.bed-showcase .photo-caption { font-size: 11px; }
.bed-signature p { font-size: 11px; }
.faq-list summary { font-size: 15px; line-height: 1.8; gap: 22px; }
.faq-list summary>span { flex-shrink: 0; }
.faq-list details p { font-size: 14px; line-height: 2; }
.footer-bottom { font-size: 12px; line-height: 2; }
.photo-credits summary { font-size: 12px; min-height: 44px; }
.photo-credits a { display: inline-block; padding: 5px 0; }
.footer-top { padding-bottom: 38px; }
.footer-controls { display: flex; align-items: center; gap: 32px; padding-top: 30px; margin-top: 30px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.footer-controls>a { display: inline-flex; align-items: center; min-height: 44px; }
.footer-controls>span { margin-left: auto; font-size: 10px; letter-spacing: .16em; }
.motion-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: transparent; color: var(--ink); padding: 10px 14px; min-height: 44px; border: 1px solid #8f765a; font-size: 12px; }
.motion-toggle:hover { background: #c9aa7e12; }
.motion-toggle:disabled { color: var(--muted); opacity: 1; }
.motion-dot { width: 6px; height: 6px; border-radius: 50%; background: #8e7c66; }
.motion-toggle[aria-pressed=true] .motion-dot { background: #e8c89c; }
#motion-state { color: var(--gold); font-size: 11px; }
.quiet-strip { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; padding: 0 8%; background: #1d1814; }
.quiet-strip>a { display: flex; align-items: center; gap: 22px; padding: 28px 28px 28px 0; border: 0; min-height: 110px; font-size: 14px; letter-spacing: 0; }
.quiet-strip>a+a { border-left: 1px solid var(--line); padding-left: 32px; }
.quiet-strip>a>span:last-child { margin-left: auto; color: var(--gold); transition: transform .3s var(--ease-out); }
.quiet-strip>a:hover>span:last-child { transform: translate(2px,-2px); }
.quiet-strip small { display: block; font-size: 9px; letter-spacing: .16em; color: var(--muted); margin-top: 5px; }
.strip-number { font: 18px Georgia,serif; color: var(--gold); }
.arrival-card { position: relative; isolation: isolate; overflow: hidden; padding: 38px; background: #181410; border: 1px solid #806448; }
.arrival-card:before { content: ''; position: absolute; width: 320px; height: 320px; right: -180px; top: 130px; border: 1px solid #c9aa7e1c; border-radius: 50%; box-shadow: 0 0 0 35px #c9aa7e07,0 0 0 70px #c9aa7e05; z-index: -1; }
.arrival-top { display: flex; align-items: center; justify-content: space-between; color: var(--gold); }
.arrival-top .eyebrow { font-size: 10px; }
.arrival-pin svg { width: 28px; height: 28px; }
.arrival-brand { font: clamp(58px,7vw,100px)/1.2 Georgia,serif; letter-spacing: .15em; color: #c9aa7e; margin: 34px 0 22px; }
.arrival-name { font: 21px/1.7 var(--serif); }
.arrival-address { font-size: 13px; color: var(--muted); line-height: 2; max-width: 300px; margin-top: 12px; }
.arrival-details { margin-top: 30px; border-top: 1px solid var(--line); }
.arrival-details>div { display: grid; grid-template-columns: 70px 1fr; gap: 15px; padding-top: 22px; font-size: 12px; }
.arrival-details span { color: var(--gold); }
.arrival-details p { color: var(--muted); line-height: 1.9; }
.arrival-map { display: flex; align-items: center; justify-content: space-between; min-height: 54px; gap: 20px; border-top: 1px solid var(--line); font-size: 13px; margin-top: 30px; padding-top: 8px; }
.arrival-map>span[aria-hidden] { color: var(--gold); }
.address { max-width: 340px; font-size: 21px; }
.copy-status { font-size: 13px; }
#address-select { color: #f0e8dd; background: #181410; border-color: var(--gold); line-height: 1.8; }
.booking-steps { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 44px; list-style: none; padding: 0; margin: 80px auto 0; max-width: 1150px; }
.booking-steps li { border-top: 1px solid #8f765a; padding-top: 24px; }
.booking-steps li>span { color: var(--gold); font: 24px Georgia,serif; }
.booking-steps h3 { font: 19px/1.7 var(--serif); margin: 18px 0 12px; }
.booking-steps p { font-size: 13px; line-height: 2; color: var(--muted); }
dialog { width: min(640px,calc(100% - 32px)); max-height: calc(100svh - 48px); background: #211c18; color: var(--ink); padding: 0; overscroll-behavior: contain; }
.dialog-body { padding: 60px 42px 36px; }
.dialog-body h2 { font-size: 36px; }
.dialog-body>p:not(.eyebrow) { font-size: 15px; line-height: 2; }
.dialog-body .small-copy { font-size: 12px!important; margin: 24px 0; }
.dialog-body .button { width: 100%; }
.dialog-checks { padding: 24px 0; margin-top: 28px; border-block: 1px solid var(--line); }
.dialog-checks h3 { font-size: 12px; color: var(--gold); letter-spacing: .04em; }
.dialog-checks ul { list-style: none; margin: 14px 0 0; padding: 0; }
.dialog-checks li { font-size: 14px; line-height: 1.9; padding: 5px 0 5px 18px; position: relative; }
.dialog-checks li:before { content: ''; position: absolute; left: 1px; top: 17px; width: 4px; height: 4px; border: 1px solid var(--gold); transform: rotate(45deg); }
.noscript-note { padding: 24px 8%; border-top: 1px solid var(--line); font-size: 14px; }
.motion-reduced { scroll-behavior: auto; }
.motion-reduced *,.motion-reduced *:before,.motion-reduced *:after { animation: none!important; transition: none!important; scroll-behavior: auto!important; }
.motion-reduced .awaiting-reveal { opacity: 1!important; transform: none!important; }
.motion-reduced .bed-drift,.motion-reduced .bed-cutout,.motion-reduced .hero-photo img { transform: none!important; will-change: auto; }
.motion-reduced .bed-cutout { opacity: 1!important; }
.motion-reduced .image-reveal:hover img { transform: none; }
.motion-reduced .map-pulse { opacity: .4; }
@media(min-width:981px) and (max-width:1200px) {
  .header { gap: 15px; padding-inline: 3%; }
  .desktop-nav { gap: 14px; font-size: 12px; }
  .header-book { font-size: 11px; gap: 10px; }
  .room-card { padding-inline: 16px; }
  .room-name { font-size: 18px; }
}
@media(min-width:981px) and (max-height:800px) {
  .hero { min-height: 810px; }
}
@media(max-width:980px) {
  .quiet-strip { padding-inline: 6%; }
  .quiet-strip>a { gap: 14px; padding-right: 18px; font-size: 13px; }
  .quiet-strip>a+a { padding-left: 20px; }
  .arrival-card { padding: 28px; }
  .location-grid { gap: 7%; }
  .arrival-details>div { grid-template-columns: 1fr; gap: 4px; }
  .booking-steps { gap: 28px; }
  .booking-steps h3 { font-size: 17px; }
  .room-card { min-height: 310px; }
}
@media(max-width:640px) {
  body { font-size: 15px; }
  .hero { min-height: 830px; height: calc(100svh - var(--draft)); }
  .hero-content { padding: 148px 25px 165px; }
  .hero-intro { font-size: 10px; }
  .hero h1 { font-size: clamp(37px,10vw,58px); line-height: 1.65; margin-bottom: 28px; }
  .hero-bottom p { font-size: 13px; }
  .hero-bottom { gap: 12px; }
  .hero-cta { font-size: 14px; margin-top: 26px; }
  .hero-cta span:not(.sr-only) { font-size: 11px; }
  .hero-location { bottom: 140px; font-size: 9px; }
  .hero-caption { font-size: 10px; bottom: 116px; left: 25px; right: 25px; width: fit-content; max-width: calc(100% - 50px); }
  .quiet-strip { display: block; padding: 0 25px; }
  .quiet-strip>a,.quiet-strip>a+a { font-size: 14px; min-height: 90px; padding: 18px 0; gap: 22px; border-left: 0; }
  .quiet-strip>a+a { border-top: 1px solid var(--line); }
  .quiet-strip small { font-size: 10px; }
  .section-pad { padding: 80px 25px; }
  .section-kicker,.sleep-top .eyebrow,.faq .eyebrow { font-size: 10px; }
  .section-kicker span:last-child { font-size: 12px; }
  .about-copy>p:first-child { font-size: 15px; }
  .small-copy { font-size: 13px; }
  .source-note,.photo-caption { font-size: 11px; }
  .text-link { font-size: 13px; }
  .facts>div { grid-template-columns: 105px 1fr; gap: 12px; }
  .facts dd { font-size: 14px; }
  .facts dt,.facts small { font-size: 10px; }
  .spa-content { padding: 65px 25px; }
  .spa-content>p:not(.source-note) { font-size: 14px; }
  .spa-photo .photo-caption { font-size: 10px; }
  .ritual h3 { font-size: 17px; }
  .ritual p { font-size: 12px; }
  .sleep-copy p { font-size: 14px; }
  .sleep-copy .text-link { font-size: 13px; }
  .bed-showcase .photo-caption { font-size: 10px; }
  .sleep-bottom .eyebrow { font-size: 9px; }
  .sleep-bottom .source-note { font-size: 11px; }
  .section-heading p { font-size: 14px; }
  .section-heading .text-link { font-size: 12px; }
  .room-card { min-height: 215px; padding: 26px 22px 25px 78px; }
  .room-name { font-size: 21px; }
  .room-english { font-size: 10px; }
  .room-tagline,.room-more { font-size: 12px; }
  .amenity-grid { gap: 32px 22px; }
  .amenity-grid h3 { font-size: 17px; }
  .amenity-grid p { font-size: 12px; line-height: 1.95; }
  .amenity-icon { width: 32px; height: 32px; margin-bottom: 20px; }
  .address { font-size: 21px; }
  .button { font-size: 13px; padding: 13px 18px; }
  .arrival-card { padding: 26px; }
  .arrival-brand { font-size: 72px; margin-top: 30px; }
  .arrival-name { font-size: 20px; }
  .arrival-address { font-size: 13px; }
  .arrival-details>div { grid-template-columns: 58px 1fr; gap: 10px; font-size: 12px; }
  .booking-steps { grid-template-columns: 1fr; gap: 30px; margin-top: 55px; }
  .booking-steps li { display: grid; grid-template-columns: 35px 1fr; gap: 4px 16px; padding-top: 22px; }
  .booking-steps li>span { grid-row: 1/3; font-size: 22px; padding-top: 5px; }
  .booking-steps h3 { margin: 0 0 8px; font-size: 18px; }
  .booking-steps p { font-size: 13px; }
  .reservation .section-kicker { font-size: 9px; gap: 18px; }
  .reservation .section-kicker>span:last-child { font-size: 11px; }
  .reservation-inner>p:not(.reservation-note) { font-size: 14px; }
  .reservation-note { font-size: 11px; }
  .faq-list summary { font-size: 14px; min-height: 76px; }
  .faq-list details p { font-size: 13px; }
  .footer { padding-bottom: calc(102px + env(safe-area-inset-bottom)); }
  .footer-bottom { font-size: 11px; }
  .footer-controls { flex-wrap: wrap; gap: 12px 24px; margin-top: 20px; padding-top: 20px; }
  .footer-controls>span { flex-basis: 100%; margin: 15px 0 0; font-size: 9px; }
  .mobile-booking { min-height: 76px; gap: 10px; }
  .mobile-booking>span { font-size: 12px; }
  .mobile-booking small { font-size: 10px; }
  .mobile-booking>a { font-size: 13px; min-width: 132px; padding: 12px 18px; }
  .mobile-menu { padding-bottom: calc(36px + env(safe-area-inset-bottom)); }
  .mobile-menu>a { font-size: 24px; min-height: 65px; }
  .mobile-menu small { font-size: 11px; }
  .dialog-body { padding: 60px 25px 28px; }
  .dialog-body h2 { font-size: 30px; }
  .dialog-body>p:not(.eyebrow) { font-size: 14px; }
  .dialog-body .small-copy { font-size: 11px!important; }
  .dialog-checks li { font-size: 13px; }
}
@media(max-width:359px) {
  .header { padding-inline: 17px; }
  .hero-content { padding-inline: 20px; }
  .hero h1 { font-size: 34px; }
  .section-pad { padding-inline: 20px; }
  .arrival-card { padding: 22px; }
  .mobile-booking { padding-inline: 12px; }
  .mobile-booking>a { min-width: 118px; }
}
@media(prefers-reduced-motion:reduce) {
  .bed-drift,.bed-cutout,.hero-photo img { transform: none!important; }
  .bed-cutout { opacity: 1!important; }
}
/* Owner-approved hotel photography, 2026-10-23. */
.photo-original { display: inline-flex; align-items: center; min-height: 28px; border-bottom: 1px solid #9f805c; color: #e0c49d; white-space: nowrap; }
.hero-photo img { object-position: 60% 58%; }
.hero-caption { max-width: 460px; }
.hero-location { bottom: 50px; }
.about-small img { object-position: 65% 50%; }
.spa-photo img { object-position: 39% 52%; }
.spa-photo .photo-caption { max-width: calc(100% - 50px); }
.bed-cutout { width: min(100%,1050px); }
.bed-showcase .photo-caption { line-height: 2; }
.room-grid-with-photos { grid-template-columns: repeat(3,minmax(0,1fr)); border-color: var(--line); }
.room-tile { min-width: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; flex-direction: column; }
.room-grid-with-photos .room-card { padding: 24px; min-height: 425px; flex: 1; border: 0; }
.room-card-photo { display: block; width: calc(100% + 48px); margin: -24px -24px 24px; overflow: hidden; aspect-ratio: 1.5; }
.room-card-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.1s var(--ease-out); }
.room-card:hover .room-card-photo img { transform: scale(1.025); }
.room-grid-with-photos .room-number { position: absolute; left: 16px; top: 16px; background: #211c18dd; border: 1px solid #c9aa7e80; padding: 4px 10px; color: #eedcc4; font: 15px/1.6 Georgia,serif; margin: 0; }
.room-grid-with-photos .room-name { font-size: 24px; }
.room-grid-with-photos .room-english { font-size: 10px; margin: 5px 0 16px; }
.room-grid-with-photos .room-tagline { font-size: 13px; }
.room-grid-with-photos .room-more { padding-top: 22px; font-size: 12px; }
.room-photo-source { display: flex; align-items: center; min-height: 44px; padding: 10px 24px 14px; font-size: 11px; color: var(--muted); border-top: 1px solid #c9aa7e20; }
.room-photo-source:hover { color: #f0dfc6; background: #c9aa7e0a; }
.room-all { padding: 35px; background: radial-gradient(ellipse at top left,#694e3a44,transparent 70%),#191410; justify-content: center; }
.room-all .eyebrow { font-size: 10px; }
.room-all h3 { font: 32px/1.7 var(--serif); margin: 25px 0 20px; }
.room-all p { color: var(--muted); font-size: 13px; line-height: 2; }
.room-all>a { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 50px; padding: 14px 0 8px; margin-top: 25px; border-bottom: 1px solid var(--gold); font-size: 13px; }
.arrival-visual { min-width: 0; }
.arrival-photo { margin-bottom: 28px; }
.arrival-photo img { height: auto; aspect-ratio: 1.7; object-fit: cover; object-position: 50% 20%; }
.dialog-photo { margin: 24px 0; }
.dialog-photo img { height: auto; aspect-ratio: 1.5; object-fit: cover; }
.dialog-photo .photo-caption { font-size: 11px; line-height: 1.9; }
.dialog-body { max-height: calc(100svh - 48px); overflow-y: auto; overscroll-behavior: contain; }
.dialog-body>p:not(.eyebrow) { clear: both; }
#room-dialog { overflow: hidden; }
.dialog-close { z-index: 3; background: #211c18; border: 1px solid var(--line); }
@media(max-width:980px) {
 .room-grid-with-photos { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .room-all { min-height: 425px; }
 .arrival-photo img { aspect-ratio: 1.3; }
}
@media(max-width:640px) {
 .hero-photo img { object-position: 61% 52%; }
 .hero-caption { font-size: 10px; bottom: 116px; }
 .hero-location { bottom: 182px; }
 .hero-caption .photo-original { min-height: 25px; }
 .spa-photo { height: 500px; }
 .spa-photo img { object-position: 34% 48%; }
 .spa-photo .photo-caption { left: 20px; max-width: calc(100% - 40px); }
 .room-grid-with-photos { grid-template-columns: 1fr; }
 .room-grid-with-photos .room-card { padding: 22px; min-height: 0; }
 .room-card-photo { margin: -22px -22px 22px; width: calc(100% + 44px); aspect-ratio: 1.45; }
 .room-grid-with-photos .room-name { font-size: 23px; }
 .room-grid-with-photos .room-more { padding-top: 20px; }
 .room-photo-source { padding-inline: 22px; }
 .room-all { min-height: 330px; padding: 30px 24px; }
 .room-all h3 { font-size: 29px; }
 .arrival-photo img { aspect-ratio: 1.4; }
 .dialog-photo img { aspect-ratio: 1.45; }
 .dialog-photo .photo-caption { font-size: 10px; }
}
@media(prefers-reduced-motion:reduce) { .room-card:hover .room-card-photo img { transform: none; } }
.motion-reduced .room-card:hover .room-card-photo img { transform: none; }

/* ---- Audit fixes (2026-10-24) ---- */
/* "위치" is only ~22px wide: give the shortest desktop nav link a 24px minimum target. */
.desktop-nav a { min-width: 24px; text-align: center; }
/* Footer source links were 13-17px tall. Padding and the matching negative margin enlarge the target without moving the text;
   the underline moves from a border (which would sit below the padding) to text-decoration. */
.footer-bottom > div > a { display: inline-block; padding: 6px 2px; margin: -6px -2px; border-bottom: 0; text-decoration: underline; text-decoration-color: #b9aea2; text-underline-offset: 3px; }
/* The photo-credits <summary> read as plain text. Same "+" language as the FAQ, turning into "x" when open. */
.photo-credits summary { gap: 10px; cursor: pointer; }
.photo-credits summary > span { text-decoration: underline; text-decoration-color: #b9aea2; text-underline-offset: 4px; }
.photo-credits summary::after { content: '+'; font-size: 18px; line-height: 1; transition: transform .3s; }
.photo-credits[open] summary::after { transform: rotate(45deg); }
.motion-reduced .photo-credits summary::after { transition: none; }
@media (prefers-reduced-motion: reduce) { .photo-credits summary::after { transition: none; } }

/* ---- Bed wordmark: "SUPER KING" is twice as long as "QUEEN", so the decorative type is smaller (2026-10-30) ---- */
.bed-wordmark { font-size: clamp(70px,11vw,176px); white-space: nowrap; }
@media (max-width: 640px) { .bed-wordmark { font-size: 12.5vw; } }