.lsn-booking { max-width: 1040px; margin: 0 auto; }
.lsn-booking .lsn-shell { background: var(--lsn-bg); border: var(--lsn-bw) solid var(--lsn-line); border-radius: calc(var(--lsn-r) * 1.5); padding: clamp(1.1rem, 3vw, 2.2rem); box-shadow: var(--lsn-shadow); overflow: hidden; }
.lsn-stepbar { margin-bottom: 1.8rem; }

.lsn-stage { animation: lsn-rise .5s var(--lsn-ease) both; }
.lsn-stage.still { animation: none; }
.lsn-stage h2:focus { outline: none; }
.lsn-head { margin-bottom: 1.4rem; display: grid; gap: .35rem; }
.lsn-foot { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1.8rem; flex-wrap: wrap; }

/* session type cards */
.lsn-types { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; }
.lsn-type { text-align: left; cursor: pointer; font: inherit; color: inherit; background: var(--lsn-bg); border: max(var(--lsn-bw), 1px) solid var(--lsn-line); border-radius: var(--lsn-r); padding: 0; overflow: hidden; display: grid; transition: transform .3s var(--lsn-ease), border-color .2s, box-shadow .3s var(--lsn-ease); }
.lsn-type:hover { transform: translateY(var(--lsn-lift)); border-color: var(--lsn-accent-line); box-shadow: 0 24px 40px -28px rgba(30, 50, 140, .45); }
.lsn-type .cover.img { height: var(--lsn-cover-h, 250px); background-size: cover; background-position: center; }
.lsn-type .body { padding: 1.2rem 1.3rem 1.3rem; display: grid; gap: .55rem; }
.lsn-type .price { font-size: 1.5rem; font-weight: 700; letter-spacing: -.02em; }
.lsn-type .meta { display: flex; gap: .5rem; flex-wrap: wrap; }

/* time step */
.lsn-when { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 2rem; }
@media (max-width: 760px) { .lsn-when { grid-template-columns: 1fr; gap: 1.4rem; } }
.lsn-cal-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .8rem; }
.lsn-cal-head b { font-size: 1.05rem; font-weight: 650; }
.lsn-nav { width: 44px; height: 44px; border-radius: 50%; border: var(--lsn-bw) solid var(--lsn-line); background: var(--lsn-bg); cursor: pointer; font-size: 1.1rem; line-height: 1; color: var(--lsn-ink); transition: background .2s, transform .2s var(--lsn-ease); }
.lsn-nav:hover:not([disabled]) { background: var(--lsn-wash); transform: scale(1.08); }
.lsn-nav[disabled] { opacity: .3; cursor: default; }
.lsn-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.lsn-dow { font-size: .72rem; font-weight: 600; text-align: center; color: var(--lsn-ink-3); padding: .3rem 0; text-transform: uppercase; letter-spacing: .06em; }
.lsn-day { aspect-ratio: 1; border-radius: calc(var(--lsn-r) * .75); border: 0; background: transparent; font: inherit; font-weight: 550; color: var(--lsn-ink-3); cursor: default; position: relative; display: grid; place-items: center; transition: background .2s, color .2s, transform .2s var(--lsn-ease), box-shadow .2s; }
.lsn-day.has { color: var(--lsn-ink); cursor: pointer; background: var(--lsn-wash); }
.lsn-day.has::after { content: ""; position: absolute; bottom: 7px; width: 4px; height: 4px; border-radius: 50%; background: var(--lsn-accent); }
.lsn-day.has:not(.sel):hover { background: var(--lsn-accent-soft); color: var(--lsn-accent); transform: scale(1.08); }
.lsn-day.sel { background: var(--lsn-accent); color: var(--lsn-accent-ink); box-shadow: 0 10px 22px -10px var(--lsn-accent); }
.lsn-day.sel:hover { filter: brightness(1.1); transform: scale(1.04); }
.lsn-day.sel::after { background: var(--lsn-accent-ink); }
.lsn-day.full { text-decoration: line-through; }
.lsn-day.today { box-shadow: inset 0 0 0 2px var(--lsn-ink-3); }
.lsn-day.today.sel { box-shadow: 0 10px 22px -10px var(--lsn-accent); }
.lsn-slots-title { font-weight: 650; margin-bottom: .2rem; }
.lsn-slots { display: grid; grid-template-columns: repeat(auto-fill, minmax(106px, 1fr)); gap: .55rem; margin-top: .9rem; }
.lsn-slot { font: inherit; font-weight: 600; font-size: .92rem; min-height: 44px; padding: .7rem .4rem; border-radius: calc(var(--lsn-r) * .75); border: max(var(--lsn-bw), 1px) solid var(--lsn-line); background: var(--lsn-bg); cursor: pointer; color: var(--lsn-ink); transition: all .2s var(--lsn-ease); animation: lsn-rise .4s var(--lsn-ease) both; animation-delay: calc(var(--i, 0) * 28ms); }
.lsn-slot:hover:not([disabled]):not(.sel) { border-color: var(--lsn-accent); color: var(--lsn-accent); background: var(--lsn-accent-soft); transform: translateY(calc(var(--lsn-lift) / 2)); }
.lsn-slot.sel { background: var(--lsn-accent); border-color: var(--lsn-accent); color: var(--lsn-accent-ink); }
.lsn-slot.sel:hover { filter: brightness(1.1); transform: translateY(calc(var(--lsn-lift) / 2)); }
.lsn-slot[disabled] { opacity: .35; text-decoration: line-through; cursor: not-allowed; }
.lsn-empty { padding: 2rem 1rem; text-align: center; color: var(--lsn-ink-3); background: var(--lsn-wash); border-radius: var(--lsn-r); }

/* summary chip */
.lsn-sum { display: flex; gap: 1rem; align-items: center; background: var(--lsn-accent-soft); border-radius: var(--lsn-r); padding: .9rem 1.2rem; flex-wrap: wrap; }
.lsn-sum b { font-weight: 650; }

/* details */
.lsn-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.lsn-form .full { grid-column: 1 / -1; }
@media (max-width: 620px) { .lsn-form { grid-template-columns: 1fr; } }
.lsn-hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.lsn-contract { max-height: 260px; overflow: auto; border: max(var(--lsn-bw), 1px) solid var(--lsn-line); border-radius: var(--lsn-r); padding: 1.1rem 1.3rem; font-size: .9rem; color: var(--lsn-ink-2); background: var(--lsn-wash); scrollbar-width: thin; }
.lsn-contract p { margin: 0 0 .8rem; }
.lsn-sig { position: relative; border: 1.5px dashed var(--lsn-accent-line); border-radius: var(--lsn-r); background: var(--lsn-bg); touch-action: none; }
.lsn-sig canvas { display: block; width: 100%; height: 150px; cursor: crosshair; touch-action: none; }
.lsn-sig .hint { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; color: var(--lsn-ink-3); font-size: .9rem; transition: opacity .2s; }
.lsn-sig.on .hint { opacity: 0; }
.lsn-sig button { position: absolute; top: 8px; right: 8px; }
.lsn-sigtype { padding: 1.1rem 1.2rem; border: 1.5px dashed var(--lsn-accent-line); border-radius: var(--lsn-r); background: var(--lsn-bg); font: italic 1.9rem/1.3 "Snell Roundhand", "Segoe Script", "Brush Script MT", cursive; min-height: 74px; color: var(--lsn-ink); overflow-wrap: anywhere; }
.lsn-sigtype.empty { color: var(--lsn-ink-3); font: 400 .9rem var(--lsn-font); display: grid; place-items: center; }
.lsn-check { display: flex; gap: .7rem; align-items: flex-start; font-size: .92rem; cursor: pointer; }
.lsn-check input { width: 24px; height: 24px; accent-color: var(--lsn-accent); margin-top: 2px; flex: none; }
.lsn-seg { display: inline-flex; padding: 4px; background: var(--lsn-wash); border-radius: var(--lsn-btn-r); gap: 2px; width: max-content; }
.lsn-seg button { border: 0; background: transparent; padding: .45rem 1rem; border-radius: var(--lsn-btn-r); font-weight: 600; font-size: .85rem; cursor: pointer; color: var(--lsn-ink-2); transition: all .2s var(--lsn-ease); }
.lsn-seg button:hover:not(.on) { color: var(--lsn-ink); background: var(--lsn-line); }
.lsn-seg button.on { background: var(--lsn-bg); color: var(--lsn-ink); box-shadow: 0 2px 8px rgba(20, 30, 80, .12); }

/* pay */
.lsn-pay { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .9fr); gap: 2rem; align-items: start; }
@media (max-width: 800px) { .lsn-pay { grid-template-columns: 1fr; } }
.lsn-opt { display: flex; gap: 1rem; align-items: center; border: max(var(--lsn-bw), 1px) solid var(--lsn-line); border-radius: var(--lsn-r); padding: 1.05rem 1.2rem; cursor: pointer; transition: all .25s var(--lsn-ease); background: var(--lsn-bg); width: 100%; font: inherit; text-align: left; color: inherit; }
.lsn-opt + .lsn-opt { margin-top: .7rem; }
.lsn-opt:hover { border-color: var(--lsn-accent-line); transform: translateY(calc(var(--lsn-lift) / 4)); }
.lsn-opt.on { border-color: var(--lsn-accent); background: var(--lsn-accent-soft); box-shadow: 0 0 0 4px color-mix(in srgb, var(--lsn-accent) 8%, transparent); }
.lsn-opt .dot { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--lsn-field-line); flex: none; position: relative; transition: border-color .2s; }
.lsn-opt.on .dot { border-color: var(--lsn-accent); }
.lsn-opt.on .dot::after { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: var(--lsn-accent); animation: lsn-pop .3s var(--lsn-ease); }
@keyframes lsn-pop { from { transform: scale(0); } to { transform: scale(1); } }
.lsn-opt .amt { margin-left: auto; font-weight: 700; font-size: 1.1rem; }
.lsn-tips { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .7rem; align-items: center; }
.lsn-chip { font: inherit; font-weight: 600; font-size: .88rem; padding: .55rem 1rem; border-radius: var(--lsn-btn-r); border: max(var(--lsn-bw), 1px) solid var(--lsn-line); background: var(--lsn-bg); cursor: pointer; transition: all .2s var(--lsn-ease); color: var(--lsn-ink); }
.lsn-chip:hover:not(.on) { border-color: var(--lsn-accent-line); background: var(--lsn-accent-soft); color: var(--lsn-accent); transform: translateY(calc(var(--lsn-lift) / 4)); }
.lsn-chip.on { background: var(--lsn-accent); border-color: var(--lsn-accent); color: var(--lsn-accent-ink); transform: scale(1.04); }
.lsn-tip-custom { width: 110px; padding: .5rem .9rem; border-radius: var(--lsn-btn-r); }
.lsn-receipt { background: var(--lsn-wash); border-radius: var(--lsn-r); padding: 1.4rem; display: grid; gap: .7rem; position: sticky; top: 16px; }
.lsn-line { display: flex; justify-content: space-between; gap: 1rem; font-size: .95rem; }
.lsn-line.total { border-top: var(--lsn-bw) solid var(--lsn-line); padding-top: .8rem; margin-top: .3rem; font-weight: 700; font-size: 1.15rem; }
.lsn-timer { font-variant-numeric: tabular-nums; }
.lsn-paypal { margin-top: 1.1rem; min-height: 60px; }

/* done */
.lsn-done { text-align: center; padding: 2rem 0 .5rem; display: grid; gap: 1rem; justify-items: center; }
.lsn-done .tick { width: 84px; height: 84px; }
.lsn-done .tick circle { stroke: var(--lsn-ok); stroke-width: 3; fill: none; stroke-dasharray: 260; stroke-dashoffset: 260; animation: lsn-draw .8s var(--lsn-ease) forwards; }
.lsn-done .tick path { stroke: var(--lsn-ok); stroke-width: 4; fill: none; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 60; stroke-dashoffset: 60; animation: lsn-draw .5s .55s var(--lsn-ease) forwards; }
@keyframes lsn-draw { to { stroke-dashoffset: 0; } }

.lsn-find { max-width: 520px; margin: 0 auto; }

.lsn-next { font-size: .86rem; color: var(--lsn-ink-2); }
.lsn-next b { color: var(--lsn-ink); }
.lsn-linkbtn { background: none; border: 0; padding: .5rem .8rem; font: inherit; font-weight: 600; font-size: .92rem; color: var(--lsn-accent); cursor: pointer; border-radius: var(--lsn-btn-r); text-decoration: underline; text-underline-offset: 3px; min-height: 44px; }
.lsn-linkbtn:hover { background: var(--lsn-accent-soft); }
select.lsn-input { appearance: auto; }

/* Sun-aware slots */
.lsn-slot .tag { display: block; margin-top: .15rem; font-size: .7rem; font-weight: 600; color: var(--lsn-ink-2); line-height: 1.2; }
.lsn-slot.sel .tag, .lsn-slot.sel:hover .tag { color: inherit; }
.lsn-slot:hover:not(.sel):not([disabled]) .tag { color: inherit; }
.lsn-slot.golden:not(.sel) { background: var(--lsn-accent-soft); border-color: var(--lsn-accent-line); }
.lsn-slot.harsh:not(.sel) { border-style: dashed; }
.lsn-inline { display: flex; gap: .6rem; align-items: stretch; } .lsn-inline .lsn-input { flex: 1; min-width: 0; text-transform: uppercase; } .lsn-inline .lsn-input::placeholder { text-transform: none; }
.lsn-sum s { color: var(--lsn-ink-3); }