@charset "UTF-8";
:root { color-scheme: light; --bg:#eef5f8; --surface:#fff; --surface-soft:#f5f8fa; --border:#d8e3e9; --text:#243e50; --text-weak:#607686; --accent:#286783; --accent-dk:#1b506b; --gold:#956a26; --notice:#ad472a; --radius:18px; }
* { box-sizing:border-box; }
body { margin:0; padding:0 24px; background:radial-gradient(ellipse at 90% 5%, #fff8e9 0, transparent 40%),var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP","Yu Gothic",sans-serif; font-size:16px; line-height:1.6; -webkit-text-size-adjust:100%; }
button,input,select { font:inherit; }
button { cursor:pointer; }
button:focus-visible,a:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
[hidden] { display:none !important; }
.icon { width:20px; height:20px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; vertical-align:middle; }
.page { max-width:1000px; min-height:100svh; margin:0 auto; padding:26px 0 14px; display:flex; flex-direction:column; justify-content:center; gap:18px; }
.panel { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:22px; align-items:start; }
.tabs { display:flex; gap:6px; padding:5px; border:1px solid #fff; border-radius:14px; background:#ffffffa6; }
.tab { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; min-height:54px; padding:7px 8px; border:0; border-radius:10px; background:transparent; color:var(--text-weak); transition:background .15s,color .15s; }
.tab__label { display:flex; align-items:center; gap:7px; font-size:14px; font-weight:700; }
.tab__caption { font-size:10px; font-weight:500; letter-spacing:.02em; }
.tab .icon { width:18px; height:18px; }
.tab:hover { background:#ffffffcc; color:var(--text); }
.tab[aria-selected="true"] { background:var(--accent); color:#fff; box-shadow:0 4px 12px #2867831f; }
.tab[aria-selected="true"]:hover { background:var(--accent-dk); color:#fff; }
.brand { display:flex; align-items:center; gap:10px; font-size:11px; font-weight:700; letter-spacing:.14em; }
.brand__mark { width:40px; height:40px; display:grid; place-items:center; border:1px solid #cfdee5; border-radius:12px; background:#fff9; color:var(--accent); }
.brand__mark .icon { width:27px; height:27px; }
.brand__caption { display:block; font-size:10px; font-weight:500; letter-spacing:.04em; color:var(--text-weak); }
.brand__badge { margin-left:auto; border:1px solid var(--border); border-radius:20px; padding:4px 10px; color:var(--text-weak); font-size:10px; font-weight:500; letter-spacing:.03em; }
.hero { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 22px 22px; }
.eyebrow { display:flex; align-items:center; gap:7px; margin:0 0 10px; color:var(--gold); font-size:12px; font-weight:600; letter-spacing:.08em; }
.eyebrow .icon { width:17px; height:17px; }
.page__title { margin:0; font-size:clamp(26px,3.2vw,34px); font-weight:750; line-height:1.45; letter-spacing:.055em; }
.page__title-brand { color:var(--accent); }
.page__lead { margin:12px 0 0; color:var(--text-weak); font-size:13px; line-height:1.9; }
.hero__art { width:290px; flex-shrink:0; }
.hero__art svg { display:block; width:100%; height:auto; }
.steps { display:flex; list-style:none; padding:13px 20px; margin:0; background:#ffffffa6; border:1px solid #fff; border-radius:12px; }
.steps li { flex:1; display:flex; align-items:center; justify-content:center; gap:9px; position:relative; color:var(--text-weak); font-size:12px; font-weight:600; }
.steps li+li::before { content:''; position:absolute; left:0; height:7px; width:7px; border-top:1px solid #a7bcc8; border-right:1px solid #a7bcc8; transform:rotate(45deg); }
.steps__number { color:var(--gold); font-size:11px; font-weight:750; }
.steps .icon { color:var(--accent); width:18px; height:18px; }
.card { min-width:0; padding:24px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); box-shadow:0 8px 25px #23465705; }
.card__title { margin:0 0 20px; display:flex; align-items:center; gap:10px; font-size:16px; font-weight:700; }
.section-number { display:grid; place-items:center; width:29px; height:29px; flex-shrink:0; border-radius:9px; background:#eaf3f7; color:var(--accent); font-size:12px; font-weight:700; }
.card__subtitle { font-size:10px; font-weight:500; color:var(--text-weak); margin-left:auto; }
.card--action { align-self:stretch; display:flex; flex-direction:column; }
.card--action .section-number { background:#fcf3e1; color:var(--gold); }
.field { margin-bottom:15px; }
.field:last-of-type { margin-bottom:0; }
.field--row { display:flex; gap:10px; }
.field__col { flex:1; min-width:0; }
.field__label { display:flex; align-items:center; gap:6px; margin-bottom:7px; font-size:12px; font-weight:650; }
.field__label .icon { width:17px; height:17px; color:#6a8b9d; }
.field__body { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.field__example { font-size:10px; font-weight:400; color:var(--text-weak); }
.input { width:100%; height:44px; min-width:0; padding:8px 10px; border:1px solid var(--border); border-radius:9px; background:var(--surface); color:var(--text); font-size:16px; transition:border-color .15s,box-shadow .15s; }
.input:hover:not(:disabled) { border-color:#8eafc1; }
.input:focus { outline:2px solid var(--accent); outline-offset:-1px; box-shadow:0 0 0 4px #28678312; }
.input:disabled,.input[readonly] { color:var(--text-weak); background:var(--surface-soft); }
.input--date { width:11em; max-width:100%; font-variant-numeric:tabular-nums; }
.input--date::-webkit-calendar-picker-indicator { cursor:pointer; padding:4px; }
.input--age { width:auto; flex:1 1 7em; }
.hint { margin:6px 0 0; font-size:11px; color:var(--text-weak); }
.hint--center { text-align:center; }
.notice { margin:8px 0 0; padding:8px 10px; border-radius:8px; background:#c23b2210; color:var(--notice); font-size:13px; font-weight:700; }
.check,.radio { display:inline-flex; align-items:center; gap:6px; font-size:12px; cursor:pointer; user-select:none; }
.check { min-height:44px; }
.check--block { display:flex; margin-top:8px; color:var(--text-weak); }
.check input,.radio input { width:18px; height:18px; accent-color:var(--accent); flex-shrink:0; }
.chips { display:flex; gap:6px; }
.chip { min-height:38px; padding:7px 13px; border:1px solid var(--border); border-radius:19px; background:var(--surface-soft); color:var(--accent); font-size:12px; font-weight:600; transition:background .15s,border-color .15s,color .15s; }
.chip:hover { border-color:var(--accent); }
.chip.is-active { background:var(--accent); border-color:var(--accent); color:#fff; }
.areas { min-width:0; margin:0 0 15px; padding:0; border:0; }
.areas__list { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,220px),1fr)); gap:0 12px; }
.areas .check { min-height:40px; }
.children:empty { display:none; }
.child { display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; padding:10px 0; border-top:1px dashed var(--border); }
.child__no { flex:0 0 3.5em; font-size:13px; color:var(--text-weak); }
.child__beds { display:flex; flex:0 0 auto; gap:14px; }
.reservation-summary { border-radius:11px; background:var(--surface-soft); padding:14px 16px; margin-bottom:16px; }
.reservation-summary__label { display:flex; align-items:center; gap:7px; margin:0 0 7px; font-size:11px; color:var(--text-weak); }
.reservation-summary__label .icon { width:17px; height:17px; }
.go__summary { margin:0; font-size:13px; font-weight:600; line-height:1.9; white-space:pre-line; overflow-wrap:anywhere; }
.clock-panel { margin-bottom:20px; text-align:center; }
.opening-time { display:flex; justify-content:center; align-items:center; gap:7px; margin:0 0 9px; color:var(--gold); font-size:12px; }
.opening-time .icon { width:17px; height:17px; }
.opening-time strong { font-size:14px; font-variant-numeric:tabular-nums; }
.clock { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:center; gap:0 10px; }
.clock__label { font-size:11px; color:var(--text-weak); white-space:nowrap; }
.clock__time { color:var(--text-weak); font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:31px; font-weight:600; font-variant-numeric:tabular-nums; letter-spacing:-.03em; }
.clock__time.is-synced { color:var(--text); }
.clock__countdown { flex:0 0 100%; font-size:13px; font-weight:600; color:var(--accent); font-variant-numeric:tabular-nums; }
.clock__countdown:empty { display:none; }
.go { display:flex; align-items:center; justify-content:center; gap:16px; margin-top:auto; padding:16px 12px; border-radius:11px; background:var(--accent); color:#fff; text-decoration:none; box-shadow:0 5px 12px #2867831a; transition:background .15s,transform .15s; }
.go:hover { background:var(--accent-dk); transform:translateY(-1px); }
.go.is-disabled { background:var(--border); color:var(--text-weak); pointer-events:none; box-shadow:none; }
.go__label { font-size:17px; font-weight:700; letter-spacing:.025em; }
.go-caption { margin:9px 0 0; font-size:10px; text-align:center; color:var(--text-weak); }
.go-sub { display:flex; justify-content:center; align-items:center; gap:6px; padding:12px 0 0; min-height:44px; color:var(--accent); font-size:11px; text-underline-offset:3px; }
.go-sub .icon { width:13px; height:13px; }
.page__foot { display:flex; justify-content:space-between; align-items:center; color:var(--text-weak); }
.footer-caption { font-size:11px; }
.text-button { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:8px; border:0; background:transparent; color:var(--accent); font-size:12px; text-decoration:underline; text-underline-offset:3px; }
.text-button .icon { width:16px; height:16px; }
.details-button { width:100%; min-height:44px; margin:0 0 12px; padding:8px 12px; border:1px solid var(--border); border-radius:8px; background:var(--surface-soft); color:var(--accent); text-align:left; font-size:13px; }
.dialog { width:min(520px,calc(100% - 24px)); max-height:calc(100svh - 32px); padding:22px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface); color:var(--text); overscroll-behavior:contain; }
.dialog::backdrop { background:#19364880; backdrop-filter:blur(3px); }
body:has(dialog[open]) { overflow:hidden; }
.dialog__head { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:10px; }
.dialog__head h2 { margin:0; font-size:16px; }
.dialog__head .text-button { flex-shrink:0; }
.dialog .hint { margin:0 0 12px; }
.dialog .radio { min-height:44px; }
.dialog__done { width:100%; min-height:44px; margin-top:12px; border:0; border-radius:8px; background:var(--accent); color:#fff; }
.card--quick { grid-column:1/-1; }
.hint--lead { margin:0 0 14px; }
.quick { display:flex; flex-direction:column; gap:12px; }
.quick__section { padding:0 16px 4px; border:1px solid var(--border); border-radius:12px; background:var(--surface-soft); }
.quick__section-title { display:flex; align-items:center; flex-wrap:wrap; gap:4px 7px; margin:0; padding:11px 0; font-size:12px; font-weight:700; color:var(--accent); }
.quick__section-title .icon { width:17px; height:17px; }
.quick__lead { margin-left:auto; font-size:10px; font-weight:500; color:var(--text-weak); }
.quick__list { display:grid; grid-template-columns:150px minmax(0,1fr); column-gap:16px; }
.quick__label { display:flex; align-items:center; margin:0; padding:8px 0; border-top:1px solid var(--border); font-size:12px; font-weight:700; line-height:1.4; }
.quick__buttons { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:8px 0; border-top:1px solid var(--border); }
.quick__button { display:inline-flex; align-items:center; min-height:38px; padding:8px 14px; border:1px solid var(--border); border-radius:19px; background:var(--surface); color:var(--accent); font-size:12px; font-weight:600; text-decoration:none; transition:background .15s,border-color .15s,color .15s; }
.quick__button:hover { border-color:var(--accent); background:#eaf3f7; }
.quick__button.is-selected { background:var(--accent); border-color:var(--accent); color:#fff; box-shadow:0 3px 9px #2867831f; }
.quick__button[aria-disabled="true"] { border-style:dashed; color:var(--text-weak); background:transparent; pointer-events:none; }
.note { font-size:13px; }
.note__title { display:flex; align-items:center; gap:7px; margin:18px 0 4px; font-size:13px; font-weight:700; color:var(--accent); }
.note__title:first-of-type { margin-top:4px; }
.note__title .icon { width:16px; height:16px; }
.note ul { margin:0; padding-left:1.2em; }
.note li { margin:10px 0; }
@media (max-width:699px) {
 body { padding:0 14px; }
 .page { max-width:480px; gap:10px; padding:max(14px,env(safe-area-inset-top)) 0 max(8px,env(safe-area-inset-bottom)); justify-content:flex-start; }
 .panel { grid-template-columns:minmax(0,1fr); gap:12px; }
 .tabs { gap:4px; padding:4px; border-radius:12px; }
 .tab { min-height:46px; padding:5px; }
 .tab__label { font-size:13px; gap:5px; }
 .tab__caption { font-size:9px; }
 .tab .icon { width:16px; height:16px; }
 .brand { font-size:9px; gap:8px; }
 .brand__caption { font-size:9px; }
 .brand__mark { width:34px; height:34px; border-radius:10px; }
 .brand__mark .icon { width:24px; height:24px; }
 .brand__badge { font-size:9px; padding:3px 7px; }
 .hero { padding:14px 2px; gap:0; position:relative; }
 .hero__copy { position:relative; z-index:1; }
 .eyebrow { display:none; }
 .page__title { font-size:clamp(22px,5.7vw,28px); letter-spacing:.015em; }
 .page__lead { display:none; }
 .hero__art { position:absolute; width:125px; right:-6px; top:0; opacity:.85; }
 .steps { padding:8px 5px; border-radius:10px; }
 .steps li { font-size:10px; gap:4px; }
 .steps .icon { width:15px; height:15px; }
 .steps__number { font-size:9px; }
 .steps li+li::before { width:4px; height:4px; left:-3px; }
 .card { padding:12px 14px; border-radius:14px; }
 .card__title { font-size:14px; margin-bottom:9px; gap:8px; }
 .section-number { width:25px; height:25px; border-radius:7px; font-size:11px; }
 .field { margin-bottom:8px; }
 .field--row { gap:7px; }
 .field__label { font-size:11px; gap:4px; margin-bottom:5px; }
 .field__label .icon { width:15px; height:15px; }
 .field__example { font-size:9px; }
 .field__body { gap:8px; }
 .input--date { width:10.5em; }
 .check { font-size:11px; gap:4px; }
 .check input { margin:0; }
 .field--party .input { padding-left:6px; padding-right:2px; }
 .field--select { display:grid; grid-template-columns:7em minmax(0,1fr); align-items:center; gap:6px; font-size:12px; }
 .field--select .field__label { margin-bottom:0; }
 .check--block { margin-top:2px; }
 .areas { margin-bottom:8px; }
 .areas__list { grid-template-columns:minmax(0,1fr); }
 .areas .check { min-height:36px; }
 .chips { gap:5px; }
 .chip { min-height:34px; padding:6px 10px; font-size:11px; }
 .hint--lead { margin-bottom:10px; }
 .quick { gap:10px; }
 .quick__section { padding:0 11px 6px; border-radius:11px; }
 .quick__section-title { padding:9px 0; font-size:11px; gap:3px 5px; }
 .quick__section-title .icon { width:15px; height:15px; }
 .quick__lead { font-size:9px; }
 .quick__list { grid-template-columns:minmax(0,1fr); }
 .quick__label { padding:8px 0 0; font-size:11px; }
 .quick__buttons { gap:6px; padding:7px 0 2px; border-top:0; }
 .quick__button { min-height:36px; padding:7px 11px; font-size:11px; }
 .reservation-summary { padding:8px 10px; margin-bottom:8px; }
 .go__summary { font-size:12px; line-height:1.7; }
 .reservation-summary__label { font-size:10px; margin-bottom:3px; }
 .clock-panel { margin-bottom:10px; }
 .opening-time { margin-bottom:0; font-size:11px; }
 .clock__time { font-size:25px; }
 .clock__countdown { flex-basis:auto; font-size:11px; }
 #clockSource { margin-top:0; font-size:10px; }
 .go { padding:12px 10px; }
 .go-caption { margin-top:5px; }
 .go__label { font-size:16px; }
 .footer-caption { font-size:9px; }
 .page__foot .text-button { font-size:11px; padding:6px 0 6px 6px; }
}
@media (max-width:370px) {
 .hero__art { width:95px; top:10px; right:-9px; opacity:.65; }
 .steps .icon { display:none; }
 .field__body { gap:4px; }
 .input--date { width:10.5em; }
 .check { font-size:10px; }
 .field--select { grid-template-columns:6.5em minmax(0,1fr); }
 .footer-caption { display:none; }
 .page__foot { justify-content:center; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; } }
@media (prefers-color-scheme:dark) {
 :root { color-scheme:dark; --bg:#152630; --surface:#203541; --surface-soft:#192e39; --border:#39505d; --text:#e1ecf1; --text-weak:#afc2cd; --accent:#8fcce7; --accent-dk:#acdff4; --gold:#e3bf7b; --notice:#ffad97; }
 body { background:radial-gradient(ellipse at 90% 5%,#344044 0,transparent 40%),var(--bg); }
 .brand__mark,.steps,.tabs { background:#203541; border-color:var(--border); }
 .tab:hover { background:#28414f; }
 .tab[aria-selected="true"],.tab[aria-selected="true"]:hover,.chip.is-active,.quick__button.is-selected { color:#152e3c; }
 .quick__button:hover { background:#28414f; }
 .quick__section { background:#1b3039; }
 .hero__art { opacity:.8; }
 .section-number { background:#284856; }
 .card--action .section-number { background:#453e2d; }
 .field__label .icon { color:#97b7c7; }
 .go,.dialog__done { color:#152e3c; }
 .go.is-disabled { color:var(--text-weak); }
}