*{box-sizing:border-box}html,body{margin:0}html{scroll-behavior:smooth}
body{font-family:Arial,Helvetica,sans-serif;color:#000;background:#dfe3fb;overscroll-behavior-y:auto}
img{display:block;max-width:100%;height:auto}
.sec{position:relative;width:100%}
.tex{background-repeat:repeat;background-size:797px auto;padding:24px 63px}
.col{width:100%;display:flex;flex-direction:column;gap:24px}
.w464{max-width:464px}
.hero{min-height:calc(100svh - 88px)}
.card{background:#f6f6f6;border-radius:4px;overflow:hidden}
.ml-form-embedBody{padding:20px 30px 30px}
.ml-form-embedContent h4{font-size:30px;font-weight:400;margin:0 0 14px;letter-spacing:.02em}
.form-control{width:100%;font-size:16px;padding:10px;border:1px solid #ccc;border-radius:4px;background:#fff}
.ml-form-embedSubmit{margin-top:12px}.ml-form-embedSubmit .primary{width:100%;padding:10px;font-size:14px;border:0;border-radius:4px;background:#000ffa;color:#fff;cursor:pointer}
.ml-error .form-control{border-color:red}
.ml-form-successBody{padding:24px 30px}.ml-form-successContent h4{font-size:30px;font-weight:400;margin:0}
.cue{display:flex;align-items:center;justify-content:center;height:88px;background:#fff;color:#000;text-decoration:none;font-size:28px;animation:bob 1.6s ease-in-out infinite}
@keyframes bob{50%{padding-top:12px}}
@media (prefers-reduced-motion:reduce){.cue{animation:none}html{scroll-behavior:auto}}
.store{background:#fff;padding:24px 0 30px;display:flex;justify-content:center}.store img{width:365px}
.yt{position:relative;width:100%;aspect-ratio:9/16;max-height:1000px}.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.contact{background-size:cover;background-position:center;padding:32px 71px;color:#fff;font-size:24px}
.contact p{margin:0 0 10px;text-shadow:0 1px 3px rgba(0,0,0,.6)}.contact a{color:#fff}.contact .handles{font-size:20px}
@media (max-width:600px){.tex{padding:16px}.contact{padding:24px 16px;font-size:18px}.contact .handles{font-size:16px}.store img{width:80vw}.hero{min-height:auto}}
/* v2: bounded fluid layout, native page scrolling and safe-area spacing. */
:root{--gutter:clamp(16px,4.4vw,63px)}
body{overflow-wrap:break-word}
.tex{padding:clamp(16px,2.2vw,28px) max(var(--gutter),env(safe-area-inset-right)) clamp(16px,2.2vw,28px) max(var(--gutter),env(safe-area-inset-left))}
.col{margin-inline:auto;min-width:0;gap:clamp(16px,2.2vw,24px)}
picture{display:block;max-width:100%}picture img{width:100%}
.hero{min-height:auto;padding-top:max(16px,env(safe-area-inset-top))}
.ml-form-embedContent h4,.ml-form-successContent h4{font-size:clamp(22px,4vw,30px);line-height:1.15}
.ml-form-embedBody{padding:clamp(16px,3vw,30px)}
.form-control,.ml-form-embedSubmit .primary{min-height:44px;font-size:16px}
.form-control{min-width:0}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #fa38ce;outline-offset:4px}
.cue{background:transparent;height:64px;font-size:clamp(26px,4vw,32px)}
.store{background:transparent;padding:16px max(16px,env(safe-area-inset-right)) 24px max(16px,env(safe-area-inset-left))}
.store a{display:block;width:min(100%,365px);min-height:44px}
.store img{width:100%;height:auto}
body{background-image:image-set(url('img/bg-texture-v2-1280.webp') type('image/webp'),url('img/bg-texture-v1.png') type('image/png'));background-size:797px auto}
.tex{background-image:image-set(url('img/bg-texture-v2-1280.webp') type('image/webp'),url('img/bg-texture-v1.png') type('image/png'))!important}
.contact{padding:32px max(var(--gutter),env(safe-area-inset-left));font-size:clamp(16px,2.2vw,24px)}
.contact p{max-width:562px;margin-inline:auto;line-height:1.5}
.contact a{display:inline-block;min-height:44px;max-width:100%;overflow-wrap:anywhere}
.contact .handles{font-size:clamp(16px,1.8vw,20px)}
main>.sec:last-child{padding-bottom:max(24px,env(safe-area-inset-bottom))}
@media(max-width:600px){.tex{padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right))}}
@media(max-height:500px) and (orientation:landscape){.hero .col{max-width:320px}.hero{padding-block:12px}.ml-form-embedBody{padding:16px}}

.contact{overflow:hidden;background:#111}.contact>picture{position:absolute;inset:0;pointer-events:none}.contact>picture img{height:100%;width:100%;object-fit:cover;object-position:center}.contact p{position:relative}

/* Store-inspired two-line Los Angeles clock and bordered mono palette control. */
body{background-image:linear-gradient(var(--tint,transparent),var(--tint,transparent)),image-set(url('img/bg-texture-v2-1280.webp') type('image/webp'),url('img/bg-texture-v1.png') type('image/png'));background-size:auto,797px auto}
.tex{background-image:none!important}
.na-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:562px;margin-inline:auto;padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left));font-family:"Space Mono",ui-monospace,monospace}
.na-clock{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid currentColor;padding:6px 8px;min-height:48px;font-size:11px;letter-spacing:.02em;line-height:1.2;white-space:nowrap;background:rgba(255,255,255,.6)}
.na-palette{min-height:48px;padding:8px 12px;border:1px solid #111;border-radius:0;background:rgba(255,255,255,.6);color:#111;font:inherit;font-size:clamp(10px,2.8vw,11px);letter-spacing:.06em;cursor:pointer}
.na-palette:hover{background:#111;color:white}
@media(prefers-reduced-motion:no-preference){.na-palette{transition:background-color .15s,color .15s}}

.na-tools{display:block;max-width:none;border-bottom:1px solid #111;padding:max(8px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 8px max(16px,env(safe-area-inset-left));background:rgba(255,255,255,.35)}
.na-tools-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:530px;margin-inline:auto}
.na-clock,.na-palette{min-height:44px}

.store a{position:relative}.store img.store-tag{position:absolute;left:85%;top:0;width:9.75%;height:auto;pointer-events:none;transform-origin:48.72% 0;animation:storeTagSway 4.5s ease-in-out infinite}
@keyframes storeTagSway{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
@media(prefers-reduced-motion:reduce){.store img.store-tag{animation:none}}
