/* Empire full site r3: the phone menu. The approved Partners menu (Design-Packs/partnersswingersclub.com/sections/18-menu.css, the live
   c5 build), rule for rule, in Empire's colours:
     Partners sheet (deep purple)        -> r10's menu sheet colours (violet to Empire ink)
     Partners pink (icons, VIP panel)    -> Empire lavender, --violet-3
     Partners ink on the panel           -> Empire ink, --ink
     Partners Sora (name, panel titles)  -> Empire Syne, --display; the name in capitals, as Empire's wordmark
   The coloured icon tiles are Partners' own tile colours, as Mark asked for the same menu. Every rule is scoped to #site-menu, so r10's
   older menu rules in site.css (same class names) never win. The sheet opens with r10's site.js (showModal; close button, backdrop,
   Escape; in-page links on the home close it and move focus). */
#site-menu{position:fixed;inset:0;border:0;padding:0;margin:0;width:100%;max-width:none;height:100%;max-height:none;background:transparent;color:var(--fg);overflow:hidden;box-shadow:none}
#site-menu::backdrop{background:rgba(5,4,10,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
#site-menu .sheet{position:absolute;inset:calc(env(safe-area-inset-top,0px) + 10px) 0 0;max-width:560px;min-height:0;margin-inline:auto;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;background:linear-gradient(180deg,#2c0f5c,#140b2c 36%,#07060f);border-radius:26px 26px 0 0;box-shadow:0 -10px 50px rgba(0,0,0,.5);padding:8px 16px calc(env(safe-area-inset-bottom,0px) + 28px);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Manrope","Helvetica Neue",Arial,sans-serif;outline:0}
#site-menu[open] .sheet{animation:sheetIn .42s cubic-bezier(.32,.72,0,1)}
@keyframes sheetIn{from{transform:translateY(100%)}to{transform:none}}
#site-menu .grab{width:38px;height:5px;border-radius:3px;background:rgba(255,255,255,.28);margin:2px auto 12px}
#site-menu .sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-inline:4px}
#site-menu .sheet .logo{display:block;font:800 2rem/1 var(--display);letter-spacing:.01em;text-transform:uppercase;color:var(--fg)}
#site-menu .m-sub{font-size:.8125rem;color:var(--mist);margin-top:3px}
#site-menu .m-close{position:relative;width:32px;height:32px;border-radius:50%;border:0;padding:0;background:rgba(255,255,255,.14);color:var(--fg);display:grid;place-items:center;cursor:pointer}
#site-menu .m-close::after{content:"";position:absolute;inset:-8px}
#site-menu .m-close svg.i{width:16px;height:16px;stroke-width:2.6}
#site-menu .m-status{display:flex;gap:8px;align-items:center;font-size:.9375rem;font-weight:600;margin-top:12px;padding:0 4px;border:0;border-radius:0;background:none}
#site-menu .m-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
#site-menu .m-actions a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px 10px;border:0;border-radius:14px;background:rgba(255,255,255,.09);font-size:.75rem;font-weight:600;color:#fff;text-decoration:none;transition:background .15s}
#site-menu .m-actions svg.i{width:23px;height:23px;color:var(--violet-3)}
#site-menu .m-actions a:active,#site-menu .m-list a:active{background:rgba(255,255,255,.14)}
#site-menu .m-list{margin-top:14px;border:0;border-radius:14px;background:rgba(255,255,255,.085);overflow:hidden}
#site-menu .m-list li{position:relative}
#site-menu .m-list li+li{border-top:0}
#site-menu .m-list li+li::before{content:"";position:absolute;left:53px;right:0;top:0;height:1px;background:rgba(255,255,255,.12)}
#site-menu .m-list-2 li+li::before{left:14px}
#site-menu .m-list a{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 12px;background:none;color:var(--fg);text-decoration:none;font-size:1.0625rem;font-weight:400;letter-spacing:-.01em;transition:background .15s}
#site-menu .m-list a>span:nth-child(2){flex:none}
/* The current page keeps aria-current (as the Empire source marks it) but no tint: Partners' menu shows none. */
#site-menu .m-list a[aria-current=page]{background:none}
#site-menu .sq{width:29px;height:29px;border-radius:7px;display:grid;place-items:center;color:#fff;flex:none;background:none}
#site-menu .sq svg.i{width:18px;height:18px;stroke-width:2.1}
#site-menu .s-red{background:linear-gradient(180deg,#b5352a,#7a1712)}
#site-menu .s-gold{background:linear-gradient(180deg,#f4d27f,#c9952f);color:#2b1d03}
#site-menu .s-bronze{background:linear-gradient(180deg,#ab8138,#8a6222)}
#site-menu .s-pink{background:linear-gradient(180deg,#f78fc9,#d6448c)}
#site-menu .s-indigo{background:linear-gradient(180deg,#8088ff,#4a4ed6)}
#site-menu .s-green{background:linear-gradient(180deg,#52dc6c,#21a547)}
#site-menu .s-coral{background:linear-gradient(180deg,#ff8f70,#e55a39)}
#site-menu .s-slate{background:linear-gradient(180deg,#a8998a,#6d5f52)}
#site-menu svg.i.chev{margin-left:auto;width:14px;height:14px;color:rgba(255,255,255,.34);stroke-width:2.8}
/* VIP panel: Partners' light panel, in Empire lavender */
#site-menu .m-vip{margin-top:16px;border:0;border-radius:18px;padding:18px 16px;background:var(--violet-3);color:var(--ink);color-scheme:light}
#site-menu .m-vip h2{font:700 1.5rem/1.1 var(--display);letter-spacing:-.03em;color:var(--ink);text-transform:none}
#site-menu .m-vip>p{color:rgba(7,6,15,.74);font-size:.9375rem;margin-top:6px}
#site-menu .m-mail{margin-top:16px;padding:14px 0 0;border:0;border-top:1px solid rgba(7,6,15,.22);border-radius:0;background:none}
#site-menu .m-mail h3{font:700 1.125rem/1.2 var(--display);letter-spacing:-.02em;color:var(--ink)}
#site-menu .m-mail form{display:grid;gap:10px;margin-top:12px}
#site-menu .m-mail label[for=em2]{font-size:.9375rem;font-weight:600;color:var(--ink)}
#site-menu #em2{width:100%;height:48px;border:1px solid #6e5a96;border-radius:12px;background:#fff;color:var(--ink);padding:0 14px;font-size:1rem}
#site-menu .m-mail .tick{display:flex;gap:10px;align-items:flex-start;min-height:44px;font-size:.875rem;font-weight:500;color:var(--ink)}
#site-menu .m-mail .tick input{width:22px;height:22px;flex:none;margin:0;accent-color:var(--violet)}
#site-menu .m-join{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:50px;margin-top:12px;padding:0 18px;border:0;border-radius:14px;background:var(--ink);color:#fff;font:600 1.0625rem/1.15 var(--body);text-decoration:none;cursor:pointer;box-shadow:none}
#site-menu .m-mail .m-join{margin-top:0;background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
#site-menu .m-mail+.m-join{margin-top:16px}
#site-menu .m-note{color:rgba(7,6,15,.74);font-size:.8125rem;margin-top:6px}
/* Partners' 44px privacy link. Empire's note is longer, so the link takes its own line at every width, as Partners' does on phones. */
#site-menu .m-note a{display:flex;width:fit-content;align-items:center;min-height:44px;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
#site-menu .m-vip .emailFormSuccess{margin-top:12px;background:rgba(255,255,255,.55);border-color:rgba(7,6,15,.25);color:rgba(7,6,15,.8)}
#site-menu .m-vip .emailFormSuccess h3,#site-menu .m-vip .emailFormSuccess strong{color:var(--ink)}
#site-menu .m-vip .emailFormError{color:#8a0d22}
/* Venue list at the bottom */
#site-menu .m-cap{margin:20px 14px -6px;font:600 .8125rem/1.3 var(--display);letter-spacing:0;text-transform:none;color:var(--mist)}
#site-menu .m-2 b{display:block;font-weight:500}
#site-menu .m-2 small{display:block;font-size:.8125rem;color:var(--mist);letter-spacing:0;margin-top:1px}
@media (prefers-reduced-motion:reduce){#site-menu[open] .sheet{animation:none}}

/* r14, preview only. Mark, 8 Nov 2026: "The mobile menu email confirmation box, you can hardly read the writing when it says thank you."
   The thank-you box is a div with both classes emailForm and emailFormSuccess, so inner.css's .emailForm>p{color:var(--mist)} (the form's
   own pale helper lines, made for dark cards) also coloured its paragraph pale on this light lavender card, overriding the dark colour the
   card sets on the box. In the menu's VIP card only, the box's paragraphs take the card's ink, as its heading already does. */
#site-menu .m-vip .emailFormSuccess p{color:var(--ink)}