@import url("/fonts/source-han-sans/hotel-fonts.css");
@import url("/fonts/type-v2.css");
/* W7 art pass 3 — one deliberate pairing for Ocean Heart (Owner 07:36:44Z: the old green+beige palette *with its font
   pairing* reads as a 100% AI template; constitution hotel direction: Classical Monument + Quiet Luxury + Immersive 3D).
   Display: Marcellus (Roman inscriptional, OFL, google/fonts @9712ecf0) — classical and calm, not the old Georgia.
   Chinese display: Source Han Serif SC SemiBold (OFL, adobe-fonts/source-han-serif 2.003R), subset by tools/build_font_subset.py
   from a generated scan of live HTML/JS/MJS/CSS under site (chat, FAQ, policies, booking, viewer-src, pay-demo, art CSS).
   No hardcoded character list; printable Latin/punctuation retained with all CJK found in sources. Re-run the subsetter
   when guest-visible copy changes. Parent supplies the OFL source font path at build time (not bundled here).
   Body/UI Latin: Plus Jakarta Sans (OFL, tokotype @18d1cd2f).
   Chinese body/UI: self-hosted WF Sans SC (Source Han Sans under OFL, renamed; real 400/500/700). The @import above
   loads hotel-fonts.css. Parent copies the three kit CSS files, their woff2 slices and the license into
   /fonts/source-han-sans/ unchanged. Chinese body does not depend on PingFang, YaHei or another vendor face.
   Key titles stay on --serif at 600 (OH Serif SC is already SemiBold). The whole page is not switched to serif. */
@font-face{font-family:'Marcellus';src:url('/fonts/Marcellus-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'OH Serif SC';src:url('/fonts/SourceHanSerifSC-SemiBold-subset.woff2') format('woff2');font-weight:400 700;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans';src:url('/fonts/PlusJakartaSans-Variable.woff2') format('woff2');font-weight:200 800;font-display:swap}
:root{--serif:'Marcellus','OH Serif SC','Source Han Serif SC','Noto Serif SC','Songti SC',serif;
 --sans:'Plus Jakarta Sans','WF Sans SC',sans-serif}
body,button,input,select,textarea,.pill,.eyebrow,.micro,label{font-family:var(--sans)}
body{font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
/* Plus Jakarta Sans has a narrow space (0.17em vs ~0.25em typical); widen it for body text readability on phones. */
body,button,input,select,textarea,.pill{word-spacing:.08em}
h1,h2,h3{word-spacing:normal}
.micro,.eyebrow,small{font-weight:500}
.pill,.room-select,label{font-weight:500}
input,select,textarea{font-weight:400}
h1,h2,h3,.addons legend,#request-details summary{font-family:var(--serif)}
h1,h2{letter-spacing:0}
:lang(zh) h1,:lang(zh) h2,:lang(zh) h3{font-family:var(--serif);letter-spacing:.02em;font-weight:600}
/* R36 has its own Home / roof / labels controls and the caption below names the model, so the 353 diagram tools and overlay label are not shown. */
#viewer-tools,[data-t="diagramLabel"]{display:none!important}

/* Production (preview wording stripped by tools/build_release.py): the status strip only appears when the guest needs to reconnect. */
.candidate-notice:not(:has([data-preview-only])):not(:has(#reconnect:not([hidden]))){display:none}

/* 常见问题 (faq.mjs renders the entries). Questions ~18 / Medium 500; answers 16 / Regular 400, both viewports. */
.faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:8%;align-items:start}
.faq-list details{border-top:1px solid var(--line);margin:0;padding:0}
.faq-list details:last-child{border-bottom:1px solid var(--line)}
.faq-list summary{list-style:none;display:flex;justify-content:space-between;gap:20px;padding:20px 0;font-family:var(--sans);font-size:18px;font-weight:500;line-height:1.6;cursor:pointer}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:'+';font-family:var(--sans);font-size:20px;font-weight:500;line-height:1;transition:transform .2s}
.faq-list details[open] summary::after{transform:rotate(45deg)}
.faq-list p{margin:0 0 22px;max-width:620px;color:var(--muted);font-family:var(--sans);font-size:16px;font-weight:400;line-height:1.75}
.faq-list a{text-decoration:underline}
@media(max-width:650px){.faq{grid-template-columns:1fr;gap:18px}.faq-list summary{font-size:18px;line-height:1.6;padding:17px 0}.faq-list p{font-size:16px;line-height:1.75}}

/* Speaker toggle for the opt-in sea sound (ambient.mjs). */
.sound-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border:0;border-radius:50%;background:none;color:inherit;cursor:pointer;transition:background .2s}
.sound-toggle:hover{background:#2e5a2c14}
.sound-toggle[aria-pressed=true]{color:#2c7f76}
@media(max-width:650px){.sound-toggle{width:36px;height:36px}}

/* Deposit first; paying at the hotel is a quiet fallback link (Owner review), plus the rescue after a failed payment. */
.deposit-line{margin:4px 0 12px;font-size:14px;color:var(--ink)}
.quiet-link{display:block;margin:12px auto 0;padding:6px 4px;border:0;background:none;color:var(--muted);font:500 13px/1.4 var(--sans,sans-serif);
 text-decoration:underline;text-decoration-color:#b9c9ad;text-underline-offset:3px;cursor:pointer}
.quiet-link:hover,.quiet-link:focus-visible{color:var(--ink);text-decoration-color:currentColor}
.pay-later{margin:10px 0 4px;padding:14px 16px;border-radius:10px;background:#f6faf2;border:1px solid #d9e2cf}
.pay-later p{margin:0 0 12px;font-size:14px;line-height:1.6;color:var(--ink)}
.pill.outline{background:transparent;color:#2e5a2c;box-shadow:inset 0 0 0 1.5px #2e5a2c}
.pill.outline:hover{background:#2e5a2c;color:#fff}
/* Terms checkbox: no native square. */
.check input[type=checkbox]{appearance:none;-webkit-appearance:none;width:20px;height:20px;min-height:20px;margin:1px 0 0;border:1.5px solid #9cae98;
 border-radius:6px;background:#fff center/14px no-repeat;cursor:pointer;transition:background-color .18s ease,border-color .18s ease,transform .12s ease}
.check input[type=checkbox]:checked{background-color:#2e5a2c;border-color:#2e5a2c;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.check input[type=checkbox]:active{transform:scale(.92)}
.check input[type=checkbox]:focus-visible{outline:3px solid #2c958b;outline-offset:2px}
@media(prefers-reduced-motion:reduce){.check input[type=checkbox]{transition:none}}
#hotel-pay-panel{margin:14px 0;padding:16px;border-radius:10px;background:#f6faf2;border:1px solid #d9e2cf}
#hotel-pay-panel p{margin:0 0 12px;font-size:14px;line-height:1.6}

/* No old-Windows scrollbars anywhere (Owner 13:27Z). The page keeps a slim, quiet bar; panels that scroll inside the
   page (chat, room picker) hide theirs, since touchpads, wheels and fingers scroll them anyway. */
html{scrollbar-width:thin;scrollbar-color:#b9c9ad transparent}
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#b9c9ad;border-radius:8px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-button{display:none;width:0;height:0}
.oh-chat-log,.stage .stage-picker{scrollbar-width:none}
.oh-chat-log::-webkit-scrollbar,.stage .stage-picker::-webkit-scrollbar{display:none}

/* Chinese components on this page. Family is the self-hosted pair, not a vendor UI font.
   Body prose stays 16/400 on a 390px phone and on desktop; site.css mobile shrinks lose on specificity.
   Titles stay serif 600. Columns, colour, logo size are unchanged. */
:lang(zh) body{font-size:16px;font-weight:400}
:lang(zh) :is(body,button,input,select,textarea,.pill,.room-select,.eyebrow,.micro,label,.features,.faq-list,.faq-list summary,.faq-list p,.intro-text,.hero-sub,.plan-heading>p,.pay-later,.pay-later p,#hotel-pay-panel,#hotel-pay-panel p){font-family:'Plus Jakarta Sans','WF Sans SC',sans-serif}
:lang(zh) :is(.intro-text,.hero-sub,.plan-heading>p:not(.eyebrow),.faq-list p,.pay-later p,#hotel-pay-panel p){font-size:16px;font-weight:400;line-height:1.75}
:lang(zh) :is(.faq-list summary,.eyebrow,label,.pill,.room-select){font-weight:500}
:lang(zh) :is(input,select,textarea){font-size:16px;font-weight:400;line-height:1.5}