:root{color-scheme:dark;--hl-red:#ff183d;--hl-red2:#b60022;--hl-ink:#050506;--hl-surface:#111115;--hl-edge:#53202a;--hl-text:#f8f4f5;--hl-muted:#aaa0a4;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html{background:#050506}
body{margin:0!important;min-height:100vh;background:radial-gradient(ellipse 55% 30% at 95% 4%,#44071355,transparent 75%),radial-gradient(ellipse 45% 30% at 0% 85%,#35000c44,transparent 75%),#050506!important;color:var(--hl-text)!important;padding-bottom:86px!important}
body:before{content:"";pointer-events:none;position:fixed;inset:0;z-index:0;background:repeating-linear-gradient(135deg,transparent 0 42px,#ff123008 43px,transparent 44px 96px);opacity:.25}
body>*{position:relative}
a{color:#ff566c}button{cursor:pointer}
body section,body .panel,body .card,body .menu,body form:not(#loginForm){border-color:#5d1728!important}
body section,body .panel,body .card{background:linear-gradient(145deg,#171318,#0b0b0e)!important;box-shadow:0 12px 35px #0009}
body input:not([type=checkbox]):not([type=radio]):not([type=range]),body select,body textarea{background:#121216!important;color:#fff!important;border:1px solid #40212b!important;border-radius:10px!important}
body button:not(.hl-toggle):not(.hl-menu-btn):not(.hl-tab):not(.hl-signout),body input[type=submit]{background:transparent!important;border:0!important;color:white!important;border-radius:0!important;box-shadow:none!important;font-weight:700}
body button:focus-visible,body a:focus-visible{outline:2px solid #ff6a7f;outline-offset:3px}
#hl-shell{font:14px system-ui,-apple-system,sans-serif!important;z-index:1000;position:relative;width:100%;max-width:none!important;margin:0!important}
#hl-shell *{box-sizing:border-box}
#hl-shell .hl-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px clamp(14px,4vw,35px);border-bottom:1px solid #4d1523;background:#08070bdc;backdrop-filter:blur(18px)}
#hl-shell .hl-brand{position:relative;text-decoration:none!important;color:#fff!important;text-align:center;letter-spacing:.24em;font-weight:450;font-size:clamp(17px,2.5vw,25px);line-height:1.1;white-space:nowrap}
#hl-shell .hl-brand small{display:block;font-size:9px;letter-spacing:.65em;margin-top:7px;color:#ddd}
#hl-shell .hl-brand svg{position:absolute;left:46%;top:-9px;width:60px;height:41px;filter:drop-shadow(0 0 6px #ff002e)}
#hl-shell .hl-menu-btn{border:0;background:none;color:#fff;font-size:27px;line-height:1;padding:6px 10px}
#hl-shell .hl-status{color:#ffabb8;font-size:10px;letter-spacing:.07em;border:1px solid #632033;border-radius:30px;padding:7px 10px}
#hl-shell .hl-drawer{display:none;position:absolute;top:100%;left:10px;right:10px;max-width:480px;padding:12px;background:#100d13;border:1px solid #852039;border-radius:14px;box-shadow:0 20px 70px #000e;z-index:1200}
#hl-shell .hl-drawer.open{display:grid;gap:4px}
#hl-shell .hl-drawer a,#hl-shell .hl-signout{background:transparent!important;box-shadow:none!important;border:0!important;color:#eee!important;text-decoration:none!important;padding:12px 14px!important;text-align:left;border-radius:9px!important;font-size:14px}
#hl-shell .hl-drawer a:hover,#hl-shell .hl-drawer a[aria-current=page]{background:#39101c!important;color:#ff7287!important}
#hl-shell .hl-bottom{position:fixed;z-index:1100;bottom:0;left:0;right:0;display:flex;justify-content:center;background:#0b0a0ef5;backdrop-filter:blur(16px);border-top:1px solid #52212e;box-shadow:0 -10px 30px #0008;padding:8px max(12px,env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom))}
#hl-shell .hl-bottom a{display:grid;place-items:center;gap:4px;min-width:70px;flex:1;max-width:145px;text-decoration:none!important;color:#aaa!important;font-size:11px}
#hl-shell .hl-bottom a.active{color:#ff2947!important}
#hl-shell .hl-bottom svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hl-page{width:min(100%,800px);margin:0 auto;padding:22px 16px 38px}
.hl-eyebrow{text-align:center;color:#ff526d;font-size:10px;letter-spacing:.36em;margin:12px 0}
.hl-heading{text-align:center;font-size:20px;letter-spacing:.1em;margin:8px 0 24px}
.hl-card{border:1px solid #722136;background:linear-gradient(155deg,#1b1018,#0b0b0e 70%);border-radius:20px;padding:22px 20px;box-shadow:0 0 26px #ff002217,0 18px 45px #000b;margin:15px 0;overflow:hidden}
.hl-card-title{font-size:14px;letter-spacing:.1em;color:#e5d9df;margin:0 0 16px}
.hl-member-hero{background:radial-gradient(circle at 50% 15%,#a2002744,transparent 48%),linear-gradient(145deg,#200d17,#07070a 65%);text-align:center}
.hl-avatar{display:block;width:120px;height:120px;border-radius:50%;object-fit:cover;margin:4px auto 15px;border:3px solid #ff2345;box-shadow:0 0 0 5px #410719,0 0 35px #ff002c70;background:#19171a}
.hl-avatar-empty{width:120px;height:120px;border-radius:50%;margin:4px auto 15px;border:3px solid #f23;display:grid;place-items:center;font-size:45px;background:#241019}
.hl-name{font-size:24px;font-weight:650;margin:8px 0 3px}
.hl-number{color:#c7b5bd;font-size:13px}
.hl-pills{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:15px 0}
.hl-pill{font-size:11px;letter-spacing:.06em;border:1px solid #ff3553;border-radius:30px;padding:5px 12px}
.hl-pill.vip{color:#ffdc6d;border-color:#a78627}
.hl-pill.good{color:#8ef0ae;border-color:#27844b}
.hl-qr{background:#fff;padding:12px;border-radius:9px;display:table;margin:20px auto 7px;box-shadow:0 0 0 2px #ff2843,0 0 26px #ed153e55}
.hl-qr canvas,.hl-qr img{display:block;max-width:100%}
.hl-note{text-align:center;color:#b7aeb2;font-size:12px}
.hl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.hl-tile{min-height:105px;background:linear-gradient(135deg,#1b171b,#0b0b0d);border:1px solid #54202e;border-radius:15px;color:#fff;text-decoration:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:12px;font-size:14px}
.hl-tile:hover{border-color:#ff2b48;box-shadow:0 0 22px #ff123021}
.hl-tile svg{width:29px;height:29px;stroke:#ff2848;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.hl-message{padding:12px 14px;border:1px solid #673244;border-radius:12px;color:#e5c9d1;margin:12px 0}
@media(min-width:900px){.hl-page{padding-top:34px}.hl-card{padding:30px}.hl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:390px){#hl-shell .hl-brand{font-size:16px}#hl-shell .hl-status{font-size:9px;padding:5px}#hl-shell .hl-bottom a{min-width:55px}}

#hl-shell .hl-brand{display:block;line-height:0;width:clamp(175px,44vw,255px);height:auto;letter-spacing:normal}#hl-shell .hl-brand img{display:block;width:100%;height:auto;max-height:62px}#hl-shell .hl-brand svg{position:static;filter:none;width:auto;height:auto}#hl-shell .hl-top{min-height:78px}#hl-shell .hl-top .hl-brand{flex-shrink:1}

/* APPROVED ORIGINAL DESIGN – reliable high-specificity reset */
html,body{font-family:Arial,Helvetica,sans-serif!important;width:100%!important;max-width:none!important;margin:0!important;overflow-x:hidden!important;background:#050506!important;color:#fff!important}
body{display:block!important;padding:0 0 90px!important;min-height:100vh!important}
body:before{display:none!important}
body>main,body>header,body>section,body>h1,body>p,body>nav{position:relative!important}
body>main{max-width:880px!important;margin:0 auto!important;padding:24px 16px!important}
body>h1,body>p,body>section,body>nav{max-width:880px!important;margin-left:auto!important;margin-right:auto!important;padding-left:16px!important;padding-right:16px!important}
#hl-shell{display:block!important;width:100%!important;max-width:none!important;position:sticky!important;top:0!important;z-index:999!important;margin:0!important;padding:0!important;border:0!important;background:#070609!important}
#hl-shell .hl-top{height:79px!important;padding:9px 18px!important;display:flex!important}
#hl-shell .hl-brand{display:block!important;flex:0 1 230px!important;max-width:230px!important;min-width:0!important;letter-spacing:0!important}
#hl-shell .hl-brand img{display:block!important;width:100%!important;height:56px!important;object-fit:contain!important}
#hl-shell .hl-bottom{position:fixed!important;bottom:0!important;left:0!important;right:0!important;display:flex!important;max-width:none!important;margin:0!important;padding:8px 8px calc(9px + env(safe-area-inset-bottom))!important;background:#0a090cf8!important}
#hl-shell .hl-bottom a{padding:4px!important;background:none!important;border:0!important;box-shadow:none!important;border-radius:0!important}
#hl-shell .hl-drawer{max-width:410px!important}
body .hl-page{width:min(100%,520px)!important;max-width:520px!important;margin:auto!important;padding:18px 14px 50px!important}
body .hl-card{background:linear-gradient(150deg,#1a1118,#070709 72%)!important;border:1px solid #60202d!important;border-radius:17px!important;padding:20px!important;margin:12px 0 18px!important;box-shadow:0 18px 42px #0009!important}
body .hl-member-hero{background:linear-gradient(#09050922,#07070bcc),url('concert-red.webp') center top/100% 55% no-repeat,#0a080c!important;text-align:center!important;padding:25px 16px 24px!important}
body .hl-member-hero .hl-avatar{width:128px!important;height:128px!important;border-radius:50%!important;margin:10px auto 14px!important;object-fit:cover!important;border:3px solid #ff2449!important;box-shadow:0 0 0 4px #300b18,0 0 35px #ff002c!important}
body .hl-member-hero .hl-avatar-empty{width:128px!important;height:128px!important;border-radius:50%!important;margin:10px auto 14px!important}
body .hl-member-hero .hl-name{font:600 24px Arial,sans-serif!important;color:white!important;margin:10px 0 4px!important}
body .hl-member-hero .hl-qr{display:table!important;margin:18px auto 8px!important;padding:10px!important;border:2px solid #ff2449!important;border-radius:11px!important;background:#fff!important;box-shadow:0 0 28px #ff153d77!important}
body .hl-member-hero .hl-qr img,body .hl-member-hero .hl-qr canvas{max-width:190px!important;max-height:190px!important}
body .hl-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
body .hl-tile{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;min-height:110px!important;background:linear-gradient(#1b1a1f,#0a0a0d)!important;border:1px solid #3b2a31!important;border-radius:12px!important;color:#fff!important;text-decoration:none!important;box-shadow:0 8px 22px #0008!important;padding:15px 8px!important}
body .hl-tile .tile-icon{color:#ff1740!important;font-size:30px!important;line-height:1!important}
body .hl-heading{font:600 21px Arial,sans-serif!important;text-align:center!important;color:#fff!important;letter-spacing:.06em!important;margin:12px 0 22px!important}
body .hl-eyebrow{font:11px Arial,sans-serif!important;color:#e63b59!important;letter-spacing:.25em!important;text-align:center!important}
body section:not(.hl-card),body .panel{background:linear-gradient(145deg,#17151a,#09090b)!important;border:1px solid #4a202c!important;border-radius:14px!important;box-shadow:0 10px 24px #0006!important}
body input:not([type=checkbox]):not([type=radio]),body textarea,body select{max-width:100%!important;background:#111216!important;border:1px solid #423039!important;border-radius:9px!important;color:#fff!important;padding:12px!important}
body button:not(.hl-menu-btn):not(.hl-signout),body input[type=submit]{background:linear-gradient(#ff304e 0%,#f5002b 18%,#820016 100%)!important;border:1px solid #ff3150!important;border-radius:11px!important;color:white!important;box-shadow:inset 0 2px 3px #ffbec044,0 0 17px #ff002d55!important;padding:12px 16px!important}
body h1,body h2,body h3{font-family:Arial,Helvetica,sans-serif!important;color:#fff!important}
body a{overflow-wrap:anywhere}
body pre{white-space:pre-wrap!important;overflow-wrap:anywhere!important}
body #video{width:100%!important;max-height:450px!important;object-fit:cover!important;border:2px solid #f13!important;border-radius:14px!important}
body #photo{width:128px!important;height:128px!important;border-radius:50%!important;object-fit:cover!important;border:2px solid #ff2846!important;box-shadow:0 0 24px #f03a!important}
body #qr{max-width:100%!important}
body #qr canvas,body #qr img{max-width:100%!important}
body .hl-page .hl-card-title{font-size:14px!important;color:#eee!important;letter-spacing:.13em!important}
@media(min-width:800px){body .hl-page{max-width:600px!important;width:min(100%,600px)!important}body .hl-member-hero{max-width:490px!important;margin-left:auto!important;margin-right:auto!important}}
@media(max-width:540px){#hl-shell .hl-top{height:70px!important;padding:7px 11px!important}#hl-shell .hl-brand{flex-basis:190px!important}#hl-shell .hl-brand img{height:50px!important}#hl-shell .hl-status{font-size:9px!important;padding:5px!important}body>main{padding:16px 12px!important}body .hl-page{padding:14px 11px 45px!important}}

/* Logo image used across all pages; never render text or a separate pulse. */
#hl-shell .hl-brand{display:flex!important;align-items:center!important;justify-content:center!important;flex:0 1 250px!important;min-width:0!important;width:250px!important;max-width:250px!important;height:64px!important;line-height:normal!important}
#hl-shell .hl-brand img{display:block!important;width:100%!important;height:64px!important;object-fit:contain!important;max-height:none!important}
@media(max-width:440px){#hl-shell .hl-brand{flex:0 1 205px!important;width:205px!important;height:56px!important}#hl-shell .hl-brand img{height:56px!important}}

#hl-shell .hl-brand img{display:block!important;width:clamp(160px,25vw,260px)!important;height:auto!important;max-width:100%!important;object-fit:contain!important}#hl-shell .hl-brand{display:flex!important;align-items:center!important;justify-content:center!important;min-width:0!important;line-height:0!important}

/* Heartlings: ALL actions are floating text/icons, NEVER red filled controls.
   Inputs remain usable dark fields. No behavior/JS changed. */
html body button,html body input[type="button"],html body input[type="submit"],html body input[type="reset"],
html body a[class*="btn"],html body a[class*="button"],html body [role="button"],
html body .chat-switch a,html body .hl-tab,html body .hl-signout,
html body .hl-ev-rsvp button,html body .hl-ev-buy,
html body .hl-chat-emoji-trigger,html body .hl-chat-emoji-choice {
 background:transparent!important;background-image:none!important;
 border:0!important;border-color:transparent!important;border-radius:0!important;
 box-shadow:none!important;text-shadow:none!important;
}
html body button:hover,html body button:active,html body button:focus,
html body [role="button"]:hover,html body a[class*="btn"]:hover,
html body .chat-switch a.active,html body .hl-drawer a:hover,
html body .hl-drawer a[aria-current="page"] {
 background:transparent!important;background-image:none!important;box-shadow:none!important;
}
html body button:disabled{opacity:.45}

/* HEARTLINGS GLOBAL – agreed icon + text design. No filled red controls, on ANY page.
   Applies to Login, Register, Forgot/Reset password, member pages, admin, chat,
   emoji pickers, event RSVP, PWA installation and dynamically inserted controls. */
html body button,html body button:hover,html body button:focus,html body button:active,
html body input[type="button"],html body input[type="submit"],html body input[type="reset"],
html body [role="button"],html body [role="button"]:hover,
html body a,html body a:hover,html body a:focus,
html body .chat-switch a,html body .chat-switch a.active,
html body .hl-ev-rsvp button,html body .hl-ev-buy,
html body .hl-drawer a,html body .hl-drawer a:hover,
html body #hl-install-button {
 background:transparent!important;background-color:transparent!important;
 background-image:none!important;
 border:0!important;border-color:transparent!important;
 box-shadow:none!important;text-shadow:none!important;
}
/* Keep form input fields dark and usable; they are not action buttons. */
html body input[type="text"],html body input[type="email"],html body input[type="password"],
html body input[type="tel"],html body input[type="date"],html body input[type="number"],
html body select,html body textarea{background-color:#121216!important;box-shadow:none!important}
/* Auth and home: action is standalone icon + text, not a full-width rectangle. */
html body:has(#loginForm) button[type="submit"],
html body:has(#registerForm) button[type="submit"],
html body:has(#form) button[type="submit"],
html body .bottom>a,html body .bottom a,
html body .language-switch button,html body #lang,
html body #hl-install-button{
 display:inline-flex!important;align-items:center!important;justify-content:center!important;
 width:auto!important;max-width:100%!important;
 margin-left:auto!important;margin-right:auto!important;
 padding:10px 8px!important;border-radius:0!important;
}
html body .bottom a{display:flex!important}
html body button[type="submit"]{letter-spacing:.02em}
html body button[type="submit"]:not(.hl-emoji-choice):before{content:'➜';color:#ff3158;display:inline-block;margin-right:9px;font-weight:600}
html body .bottom a:before{content:'➜';color:#ff3158;display:inline-block;margin-right:9px}
/* Selected tabs and choices: red TEXT/icon only. */
html body .chat-switch a.active,html body [aria-pressed="true"].hl-tab,
html body .language-switch button[aria-pressed="true"]{color:#ff3158!important}
/* Keep the original red three-line hamburger icon, never a background. */
html body #hl-shell .hl-menu-btn{background:transparent!important;border:0!important;box-shadow:none!important}