:root{color-scheme:dark;--bg:#090909;--panel:#141414;--text:#fafafa;--muted:#b5b5b9;--red:#f20b29;--line:#333;--ok:#6ee7a0;--warn:#ffd166;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-size:19px;line-height:1.6}
[hidden]{display:none!important}
a{color:inherit}
.top{display:flex;align-items:center;justify-content:space-between;padding:16px max(20px,calc((100vw - 760px)/2));border-bottom:1px solid #ffffff18}
.brand{display:flex;flex-direction:column;align-items:center;width:110px;text-decoration:none}
.brand img{width:100%;height:auto}
.brand span{font-size:9px;font-weight:600;letter-spacing:5px;margin:8px 0 0 5px;color:#fff}
main{max-width:760px;margin:0 auto;padding:28px 20px 60px}
h1{font-size:2rem;line-height:1.2;margin:.2em 0 .4em}
h2{font-size:1.35rem;margin:0 0 .3em}
.lead{color:var(--muted)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:22px;margin:18px 0}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.price{font-size:1.8rem;font-weight:700;margin:.2em 0}
.muted{color:var(--muted);font-size:.9em}
label{display:block;font-weight:600;margin:14px 0 6px}
input{width:100%;min-height:54px;font:inherit;color:#fff;background:#000;border:1px solid #666;border-radius:12px;padding:10px 14px}
input.code{font-size:1.8rem;letter-spacing:.35em;text-align:center}
button{font:inherit;cursor:pointer;min-height:54px;border-radius:12px;border:2px solid transparent;padding:10px 20px;color:#fff}
.primary{background:var(--red);font-weight:700}
.primary:hover{filter:brightness(1.1)}
.ghost{background:none;border-color:#666}
.ghost:hover{border-color:var(--red)}
.full{width:100%}
button:disabled{opacity:.5;cursor:not-allowed}
button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:3px}
.banner{border-radius:12px;padding:12px 16px;margin:14px 0;border:1px solid var(--warn);color:var(--warn)}
.ok{border-color:var(--ok);color:var(--ok)}
.err{color:#ff8a8a;min-height:1.6em}
.pill{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:2px 12px;font-size:.85em;color:var(--muted)}
.giftcode{font-family:ui-monospace,Menlo,monospace;font-size:1.2rem;letter-spacing:.06em;word-break:break-all}
.row{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between}
.foot{text-align:center;color:var(--muted);padding:30px 20px;font-size:.9rem}
.linklike{background:none;border:0;color:var(--muted);text-decoration:underline;min-height:44px;padding:6px 4px}
/* Hour packages: large, plain cards that read as one choice (older users first). */
.pkgs{margin:18px 0}
.pkg{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;width:100%;background:var(--panel);border:2px solid var(--line);border-radius:16px;padding:20px;color:var(--text);font-weight:400}
.pkg:hover{border-color:#888}
.pkg[aria-pressed="true"]{border-color:var(--red);box-shadow:0 0 0 2px var(--red) inset}
.pkg-name{font-size:1.35rem;font-weight:700}
.pkg-hours{font-size:1.15rem}
.pkg-price{font-size:1.8rem;font-weight:700;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.pkg-valid{color:var(--muted)}
.pkg-note{color:var(--warn);font-size:.9em}
.pkg-check{display:none;color:var(--red);font-weight:700}
.pkg[aria-pressed="true"] .pkg-check{display:block}
.testlabel{font-size:.8rem;font-weight:600;border:1px solid var(--warn);color:var(--warn);border-radius:999px;padding:1px 10px}
.forwhom{border:1px solid var(--line)}
.forwhom legend{font-weight:700;padding:0 6px}
.radio{display:flex;align-items:center;gap:12px;font-weight:400;margin:10px 0;min-height:44px;cursor:pointer}
.radio input{width:26px;min-height:26px;height:26px;margin:0;accent-color:var(--red)}
.big{font-size:1.15rem;min-height:62px;margin-top:8px}
.secondary{text-align:center;margin-top:18px}
.hours{font-size:2.4rem;font-weight:700;margin:.1em 0}
details summary{cursor:pointer;min-height:44px;display:flex;align-items:center}

/* Same look as the redesigned home page (owner, 3 Nov 2026): the app's mountain photo behind
   everything, white text straight on the photo, no coloured boxes. Choices are hairline-framed so
   they still read as large, tappable options (older users first); the red button is the only colour. */
html, body {
  background: linear-gradient(rgba(0,0,0,.38), rgba(0,0,0,.58)), url("assets/mountains.png") center top / cover fixed no-repeat #1b1b22;
}
body, body * { color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.85); }
button.primary, button.primary * { text-shadow: none; }
.top { background: rgba(0,0,0,.35); border-bottom: 0; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
h1 { font-size: 2.3rem; }
.lead, .muted, .pkg-valid, .foot, .linklike { color: #fff; opacity: .9; }
.card, .forwhom { background: transparent; border: 0; border-top: 1px solid rgba(255,255,255,.45); border-radius: 0; padding: 22px 0; }
.pkg { background: rgba(0,0,0,.22); border: 1px solid rgba(255,255,255,.55); border-radius: 18px; }
.pkg:hover { border-color: #fff; }
.pkg[aria-pressed="true"] { border-color: #fff; box-shadow: 0 0 0 3px #fff inset; background: rgba(0,0,0,.32); }
.pkg-check, .pkg[aria-pressed="true"] .pkg-check { color: #fff; }
.pkg-note { color: #fff; opacity: .85; font-style: italic; }
.testlabel, .pill { border-color: rgba(255,255,255,.8); color: #fff; }
.banner, .banner.ok { border: 0; border-left: 3px solid #fff; border-radius: 0; color: #fff; padding: 6px 0 6px 16px; }
input { background: rgba(0,0,0,.35); border-color: rgba(255,255,255,.7); text-shadow: none; }
.ghost { border-color: rgba(255,255,255,.75); }
.ghost:hover { border-color: #fff; }
.radio input { accent-color: #fff; }
.err { color: #ffd0d0; }
/* Language menu: shows the current language; the list opens below it. */
.langwrap { position: relative; }
#langToggle { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; padding: 8px 14px; }
.langlist { position: absolute; right: 0; top: calc(100% + 8px); min-width: 200px; z-index: 10; padding: 6px;
  background: rgba(10,10,12,.92); border: 1px solid rgba(255,255,255,.6); border-radius: 14px; box-shadow: 0 16px 40px rgba(0,0,0,.6); }
.langlist button { display: flex; width: 100%; align-items: center; gap: 12px; min-height: 48px; border: 0; background: none; text-align: left; padding: 10px 14px; border-radius: 10px; }
.langlist button:hover, .langlist button[aria-selected="true"] { background: rgba(255,255,255,.12); }
.langlist .tick { margin-left: auto; }

/* Same as the home page after the owner's review (3 Nov 2026): no film over the photo, book serif
   headings, lighter frames on the choices. */
html, body { background: url("assets/mountains.png") center top / cover fixed no-repeat #2b2a33; }
body, body * { text-shadow: 0 1px 2px rgba(0,0,0,.6), 0 0 22px rgba(0,0,0,.38); }
.top { background: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
h1, h2, .pkg-name { font-family: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif; font-weight: 600; }
h1 { font-size: 2.4rem; }
.pkg { background: rgba(0,0,0,.12); }
.pkg[aria-pressed="true"] { background: rgba(0,0,0,.2); }
/* Site menu on the purchase page, like the home page. */
.toprow { display: flex; align-items: center; gap: 10px; }
.menuwrap { position: relative; }
.menuBtn { display: inline-flex; flex-direction: column; align-items: center; gap: 4px; border: 0; min-height: 46px; padding: 4px 8px; font-size: 11px; }
.hamburger { width: 24px; display: grid; gap: 5px; }
.hamburger i { height: 2px; background: #fff; display: block; box-shadow: 0 1px 2px rgba(0,0,0,.5); }
.siteMenu { position: absolute; right: 0; top: calc(100% + 8px); width: min(320px, calc(100vw - 40px)); z-index: 10; padding: 8px 16px;
  background: rgba(22,22,28,.95); border: 1px solid rgba(255,255,255,.5); border-radius: 16px; box-shadow: 0 20px 50px rgba(0,0,0,.5); text-shadow: none; }
.siteMenu a { display: flex; align-items: center; min-height: 52px; text-decoration: none; border-bottom: 1px solid rgba(255,255,255,.15); font-size: 18px; }
.siteMenu a:last-child { border: 0; }

/* Owner (3 Nov 2026): the chosen package gets a clear red emphasis; "for me / buy as a gift" are two big
   buttons; add-ons are visible but locked for guests; the choice and its price are summed up below. */
.pkg[aria-pressed="true"] { border: 3px solid #e1001c !important; box-shadow: 0 0 0 2px rgba(225,0,28,.35), 0 10px 30px rgba(0,0,0,.35) !important; background: rgba(0,0,0,.24) !important; }
.pkg[aria-pressed="true"] .pkg-check { color: #fff; background: #e1001c; border-radius: 999px; padding: 2px 12px; text-shadow: none; display: inline-block; }
.pkg.locked { opacity: .62; cursor: not-allowed; }
.pkg.locked .pkg-price { text-decoration: none; }
.pkg-lock { font-size: .9em; font-style: italic; margin-top: 4px; }
.whom { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0 8px; }
.whom button { min-height: 58px; border-radius: 999px; border: 2px solid rgba(255,255,255,.8); background: rgba(0,0,0,.18); font-weight: 700; font-size: 1.05rem; padding: 8px 14px; line-height: 1.25; }
.whom button[aria-pressed="true"] { background: #e1001c; border-color: #e1001c; text-shadow: none; }
.giftbox { margin: 6px 0 4px; }
.choice-summary { font-size: 1.2rem; font-weight: 700; margin: 18px 0 6px; }
.choice-summary:empty { display: none; }
@media (max-width: 420px) {
  .whom { grid-template-columns: 1fr; }
  .pkg { padding: 16px; }
  .pkg-price { font-size: 1.6rem; }
}
