:root { color-scheme: light dark; }
    body { margin:0; background:light-dark(#f3f0e7,#1d201e); }
    #db-mockup { --db-paper:light-dark(#f3f0e7,#1d201e); --db-ink:light-dark(#19211e,#f3f0e7); --db-panel:light-dark(#fffdf7,#272c28); --db-muted:light-dark(#5c635d,#b9bfb9); --db-line:light-dark(#d6d7cd,#484f47); --db-orange:light-dark(#f45d32,#ff8058); --db-on-orange:#17201b; --db-green:light-dark(#244a32,#bdde9a); --db-soft:light-dark(#e2e9d9,#35402f); --db-error:light-dark(#9c3024,#ffae9b); background:var(--db-paper); color:var(--db-ink); font:15px/1.5 'Arial',sans-serif; max-width:1200px; margin:0 auto; text-align:left; }
    #db-mockup * { box-sizing:border-box; }
    #db-mockup [hidden] { display:none !important; }
    #db-mockup button, #db-mockup input, #db-mockup select { font:inherit; }
    #db-mockup button { color:inherit; }
    #db-mockup button:disabled { cursor:not-allowed; opacity:.45; }
    #db-mockup button:not(:disabled) { cursor:pointer; }
    #db-mockup button:focus-visible, #db-mockup input:focus-visible { outline:3px solid var(--db-orange); outline-offset:3px; }
    #db-mockup h1,#db-mockup h2,#db-mockup h3,#db-mockup p { margin:0; }
    #db-mockup .db-demo { background:var(--db-ink); color:var(--db-paper); font-size:11px; letter-spacing:1.4px; padding:8px 28px; text-transform:uppercase; }
    #db-mockup .db-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:23px 32px; border-bottom:1px solid var(--db-line); flex-wrap:wrap; }
    #db-mockup .db-logo { border:0; padding:0; background:none; font-size:25px; font-weight:900; letter-spacing:-1.6px; }
    #db-mockup .db-logo span { color:var(--db-orange); }
    #db-mockup .db-nav { display:flex; flex-wrap:wrap; gap:5px; align-items:center; }
    #db-mockup .db-nav button { border:0; border-radius:5px; background:transparent; padding:9px 12px; font-size:13px; }
    #db-mockup .db-nav button[aria-current="page"] { background:var(--db-ink); color:var(--db-paper); }
    #db-mockup .db-main { padding:38px 38px 30px; min-height:575px; }
    #db-mockup .db-eyebrow { text-transform:uppercase; font-size:11px; letter-spacing:1.7px; font-weight:700; display:flex; align-items:center; gap:8px; }
    #db-mockup .db-dot { width:7px; height:7px; background:var(--db-green); border-radius:50%; display:inline-block; }
    #db-mockup .db-hero { display:grid; grid-template-columns:1.15fr .85fr; gap:36px; padding:34px 0 38px; align-items:center; }
    #db-mockup .db-headline { font-size:clamp(40px,5.8vw,69px); font-weight:900; line-height:1.01; letter-spacing:-3.5px; max-width:570px; }
    #db-mockup .db-headline em { font-family:Georgia,serif; font-weight:400; color:var(--db-orange); }
    #db-mockup .db-copy { max-width:425px; color:var(--db-muted); margin-top:23px; font-size:15px; }
    #db-mockup .db-live { border:1px solid var(--db-line); border-radius:10px; padding:24px; background:var(--db-panel); position:relative; }
    #db-mockup .db-sticker { display:inline-block; background:var(--db-orange); color:var(--db-on-orange); padding:5px 12px; font-weight:800; font-size:11px; letter-spacing:1px; transform:rotate(-5deg); position:absolute; right:15px; top:-15px; }
    #db-mockup .db-target { font-size:clamp(22px,3.4vw,37px); font-weight:800; letter-spacing:-1.3px; margin:22px 0 7px; overflow-wrap:anywhere; }
    #db-mockup .db-small { color:var(--db-muted); font-size:12px; }
    #db-mockup .db-primary, #db-mockup .db-secondary { min-height:44px; border-radius:5px; border:1px solid var(--db-ink); padding:11px 17px; font-size:13px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; gap:10px; text-decoration:none; }
    #db-mockup .db-primary { background:var(--db-ink); color:var(--db-paper); }
    #db-mockup .db-primary.db-orange { background:var(--db-orange); border-color:var(--db-orange); color:var(--db-on-orange); }
    #db-mockup .db-secondary { background:transparent; color:var(--db-ink); }
    #db-mockup .db-full { width:100%; }
    #db-mockup .db-link { background:none; border:0; text-decoration:underline; text-underline-offset:3px; padding:9px 0; color:var(--db-ink); font-size:12px; }
    #db-mockup .db-track { height:4px; background:var(--db-line); margin:24px 0 10px; border-radius:10px; overflow:hidden; }
    #db-mockup .db-track span { display:block; height:100%; width:100%; background:var(--db-orange); transition:width .3s; }
    #db-mockup .db-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin-top:20px; }
    #db-mockup .db-ad { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:24px 26px; background:var(--db-orange); color:var(--db-on-orange); border-radius:7px; }
    #db-mockup .db-ad h2 { font-size:25px; letter-spacing:-.8px; font-weight:800; }
    #db-mockup .db-ad p { font-size:13px; margin-top:5px; }
    #db-mockup .db-ad .db-primary { background:#17201b; color:#fff9ef; border-color:#17201b; white-space:nowrap; }
    #db-mockup .db-footer { border-top:1px solid var(--db-line); padding:17px 32px; display:flex; justify-content:space-between; gap:15px; flex-wrap:wrap; color:var(--db-muted); font-size:11px; }
    #db-mockup .db-footer button { font:inherit; background:transparent; border:0; padding:0; color:inherit; text-decoration:underline; }
    #db-mockup .db-title { font-size:35px; font-weight:900; letter-spacing:-1.4px; line-height:1.1; }
    #db-mockup .db-title { margin-top:10px; }
    #db-mockup .db-booking-columns { margin-top:28px; }
    #db-mockup .db-form-heading { margin-top:30px; }
    #db-mockup .db-spaced { margin-top:16px; }
    #db-mockup .db-booking-title { font-size:24px; margin:12px 0 8px; overflow-wrap:anywhere; }
    #db-mockup .db-account-bar { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-top:14px; }
    #db-mockup .db-account-bar p { overflow-wrap:anywhere; min-width:0; }
    #db-mockup #auth-panel { max-width:440px; margin-top:25px; }
    #db-mockup .db-info-copy { margin-top:25px; max-width:720px; white-space:pre-line; }
    #db-mockup .db-footer > div { display:flex; gap:15px; }
    #db-mockup .db-inline-link { border:0; background:none; padding:0; font:inherit; text-decoration:underline; }
    #db-mockup .db-subtitle { color:var(--db-muted); margin-top:10px; font-size:13px; }
    #db-mockup .db-steps { display:flex; gap:20px; margin:25px 0 28px; border-bottom:1px solid var(--db-line); flex-wrap:wrap; }
    #db-mockup .db-step { padding:0 0 11px; border-bottom:3px solid transparent; color:var(--db-muted); font-size:12px; }
    #db-mockup .db-step[data-active="true"] { color:var(--db-ink); border-color:var(--db-orange); font-weight:700; }
    #db-mockup .db-columns { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr); gap:36px; align-items:start; }
    #db-mockup .db-section-title { font-size:16px; font-weight:800; margin-bottom:14px; }
    #db-mockup .db-calendar { background:var(--db-panel); border:1px solid var(--db-line); border-radius:7px; padding:17px; }
    #db-mockup .db-month { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
    #db-mockup .db-month button { border:1px solid var(--db-line); background:transparent; border-radius:4px; width:36px; height:36px; }
    #db-mockup .db-days { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px; }
    #db-mockup .db-days > span { text-align:center; padding:5px 0; color:var(--db-muted); font-size:11px; }
    #db-mockup .db-day { border:0; border-radius:4px; min-height:39px; background:transparent; padding:6px 1px; font-size:12px; }
    #db-mockup .db-day[data-booked="true"] { text-decoration:line-through; background:var(--db-line); }
    #db-mockup .db-day[aria-pressed="true"] { background:var(--db-soft); color:var(--db-green); }
    #db-mockup .db-day[data-start="true"] { background:var(--db-ink); color:var(--db-paper); font-weight:700; }
    #db-mockup .db-legend { display:flex; gap:15px; margin-top:13px; font-size:11px; color:var(--db-muted); flex-wrap:wrap; }
    #db-mockup .db-legend i { width:9px; height:9px; display:inline-block; background:var(--db-line); border-radius:2px; margin-right:5px; }
    #db-mockup .db-legend i.db-sel { background:var(--db-soft); }
    #db-mockup .db-label { display:block; font-size:12px; font-weight:700; margin:16px 0 7px; }
    #db-mockup .db-field { width:100%; min-height:44px; border:1px solid var(--db-line); border-radius:5px; padding:10px 12px; background:var(--db-panel); color:var(--db-ink); font-size:16px; }
    #db-mockup .db-durations { display:flex; flex-wrap:wrap; gap:6px; }
    #db-mockup .db-duration { border:1px solid var(--db-line); background:var(--db-panel); border-radius:4px; min-width:40px; min-height:42px; padding:7px 10px; font-size:12px; }
    #db-mockup .db-duration[aria-pressed="true"] { background:var(--db-ink); color:var(--db-paper); border-color:var(--db-ink); }
    #db-mockup .db-summary { border-top:4px solid var(--db-orange); background:var(--db-panel); padding:23px; border-radius:0 0 7px 7px; }
    #db-mockup .db-row { display:flex; justify-content:space-between; gap:16px; margin-top:14px; font-size:12px; }
    #db-mockup .db-row span { color:var(--db-muted); }
    #db-mockup .db-row strong { text-align:right; font-weight:700; overflow-wrap:anywhere; min-width:0; }
    #db-mockup .db-price { display:flex; justify-content:space-between; align-items:baseline; padding-top:20px; margin-top:20px; border-top:1px dashed var(--db-line); }
    #db-mockup .db-price strong { font-size:32px; letter-spacing:-1px; }
    #db-mockup .db-hint { color:var(--db-muted); font-size:11px; margin-top:9px; }
    #db-mockup .db-notice { padding:12px 15px; background:var(--db-soft); color:var(--db-green); border-radius:5px; font-size:12px; margin-top:18px; }
    #db-mockup .db-error { color:var(--db-error); background:var(--db-panel); border-left:3px solid var(--db-error); border-radius:3px; padding:10px 13px; font-size:12px; margin:15px 0; }
    #db-mockup .db-check { display:flex; gap:10px; align-items:start; margin-top:16px; font-size:12px; }
    #db-mockup .db-check input { width:18px; height:18px; accent-color:var(--db-green); flex-shrink:0; }
    #db-mockup .db-rules { padding:17px 18px; margin-top:20px; background:var(--db-panel); border:1px solid var(--db-line); border-radius:5px; }
    #db-mockup .db-rules ul { margin:8px 0 0; padding-left:18px; font-size:12px; color:var(--db-muted); }
    #db-mockup .db-account-switch { display:flex; border-bottom:1px solid var(--db-line); gap:20px; margin-bottom:22px; }
    #db-mockup .db-account-switch button { padding:10px 0; border:0; border-bottom:2px solid transparent; background:none; font-size:13px; }
    #db-mockup .db-account-switch button[aria-pressed="true"] { border-bottom-color:var(--db-orange); font-weight:700; }
    #db-mockup .db-status { display:inline-flex; gap:6px; align-items:center; background:var(--db-soft); color:var(--db-green); padding:5px 9px; font-size:11px; border-radius:4px; }
    #db-mockup .db-status.db-pending { background:var(--db-paper); color:var(--db-muted); border:1px solid var(--db-line); }
    #db-mockup .db-confirm { padding:25px 0 32px; max-width:650px; }
    #db-mockup .db-confirm h2 { margin:18px 0 12px; }
    #db-mockup .db-confirm p { color:var(--db-muted); font-size:13px; }
    #db-mockup .db-demo-controls { margin-top:27px; padding-top:16px; border-top:1px dashed var(--db-line); }
    #db-mockup .db-demo-controls .db-actions { margin-top:10px; }
    #db-mockup .db-booking { background:var(--db-panel); border:1px solid var(--db-line); border-radius:7px; padding:23px; margin-top:23px; }
    #db-mockup .db-booking-head { display:flex; justify-content:space-between; gap:14px; align-items:start; flex-wrap:wrap; }
    #db-mockup .db-booking h3 { font-size:23px; letter-spacing:-.7px; overflow-wrap:anywhere; }
    #db-mockup .db-empty { border:1px dashed var(--db-line); padding:35px 25px; border-radius:8px; margin-top:25px; }
    #db-mockup .db-payment-options { display:flex; gap:10px; flex-wrap:wrap; margin:17px 0; }
    #db-mockup .db-payment-options label { border:1px solid var(--db-line); padding:14px; border-radius:5px; background:var(--db-panel); font-size:13px; }
    #db-mockup .db-toast { margin-top:14px; font-size:12px; color:var(--db-green); }
    @media(max-width:750px) { #db-mockup .db-main { padding:28px 24px; } #db-mockup .db-hero { gap:25px; } #db-mockup .db-headline { letter-spacing:-2.3px; } #db-mockup .db-columns { gap:22px; grid-template-columns:1.15fr .85fr; } #db-mockup .db-summary { padding:18px; } }
    @media(max-width:580px) { #db-mockup .db-header { padding:19px; gap:14px; } #db-mockup .db-nav { width:100%; } #db-mockup .db-nav button { flex:1; padding:10px 8px; } #db-mockup .db-main { padding:27px 19px; min-height:640px; } #db-mockup .db-hero { grid-template-columns:1fr; padding:25px 0 30px; gap:34px; } #db-mockup .db-headline { font-size:49px; } #db-mockup .db-columns { grid-template-columns:1fr; gap:24px; } #db-mockup .db-ad { flex-direction:column; align-items:start; padding:22px; } #db-mockup .db-ad h2 { font-size:25px; } #db-mockup .db-ad .db-primary { width:100%; } #db-mockup .db-steps { gap:15px; } #db-mockup .db-step { font-size:11px; } #db-mockup .db-title { font-size:32px; } #db-mockup .db-footer { padding:16px 19px; } #db-mockup .db-demo { padding:8px 19px; } #db-mockup .db-day { min-height:44px; } #db-mockup .db-month button { min-width:44px; min-height:44px; } }
    @media(prefers-reduced-motion:reduce) { #db-mockup .db-track span { transition:none; } }