/* Home > Live data (app/views/partials/home-live.php) and the live tiles on each clinic's page */
.live{position:relative;margin:30px 0 56px;padding:34px;border-radius:24px;border:1px solid var(--edge-hot);
  background:radial-gradient(120% 140% at 0% 0%,rgba(0,180,197,.12),transparent 55%),radial-gradient(120% 140% at 100% 0%,rgba(196,154,116,.16),transparent 55%),var(--deep)}
.live__head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:24px;align-items:end;margin-bottom:24px}
.live__head .big{margin:6px 0 0}
.live__dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:#3FE0A8;animation:livePulse 2s infinite;margin-right:6px;vertical-align:middle}
@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(63,224,168,.6)}70%{box-shadow:0 0 0 10px rgba(63,224,168,0)}100%{box-shadow:0 0 0 0 rgba(63,224,168,0)}}
.live__tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:12px;margin-bottom:22px}
.live__t{background:var(--panel);border:1px solid var(--edge);border-radius:16px;padding:16px 16px 10px;display:flex;flex-direction:column;gap:4px}
.live__l{font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
.live__v{font:600 30px var(--display);color:var(--paper)}
.live__s{font-size:13px}
.live__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:22px}
.live__box{background:var(--panel);border:1px solid var(--edge);border-radius:18px;padding:22px}
.live__rank{list-style:none;margin:10px 0 16px;padding:0}
.live__rank a,.live__moves a{display:flex;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px solid var(--edge);color:var(--paper)}
.live__rank a:hover b,.live__moves a:hover b{color:var(--cyan-hot)}
.live__rank b{min-width:120px}
.live__rank span:last-child{color:var(--mute);font-size:13.5px}
.live__n{font:600 12px var(--mono);color:var(--cyan);min-width:22px}
.live__moves{list-style:none;margin:10px 0 18px;padding:0}
.live__moves b{flex:1}
.live__h2{margin-top:6px}
.live__q{list-style:none;margin:8px 0;padding:0;font-size:14.5px}
.live__q li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-bottom:1px solid var(--edge)}
@media (max-width:900px){.live{padding:22px}.live__head,.live__grid{grid-template-columns:1fr}}

/* filters as buttons */
.ld__bar{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-bottom:10px}
.ld__grp{display:flex;flex-wrap:wrap;gap:6px}
.ld__refresh{border-color:rgba(63,224,168,.45)!important;color:#3FE0A8!important}
.ld__refresh:disabled{opacity:.6}
.ld__pop{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:4px 0 10px;padding:12px;border:1px solid var(--edge);border-radius:12px;background:var(--panel)}
.ld__pop[hidden]{display:none}
.ld__pop input{background:var(--panel-solid);border:1px solid var(--edge);color:var(--paper);border-radius:10px;padding:8px 12px;font:15px var(--body);min-width:220px}
.ld__locs{display:flex;flex-wrap:wrap;gap:6px;width:100%;max-height:220px;overflow:auto}
.ld__sel{font:500 15px var(--display);color:var(--cyan-hot);margin:6px 0 14px}
.ld__tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin-bottom:22px}
.ld__svg{width:100%;height:auto;display:block}
.live__upd{font-size:13px;margin-top:8px}
.ld__grp--end{margin-left:auto}
.ld__apply{border-radius:999px;padding:9px 18px;font-weight:600;opacity:.55;transition:opacity .2s,box-shadow .2s}
.ld__apply.is-hot{opacity:1;box-shadow:0 0 0 3px rgba(196,154,116,.35);animation:ldHot 1.6s ease-in-out infinite}
@keyframes ldHot{50%{box-shadow:0 0 0 6px rgba(196,154,116,.12)}}
.ld__f{display:inline-flex;align-items:center;gap:8px}
.ld__n{margin-left:6px}
.ld__pop--locs{flex-direction:column;align-items:stretch}
.ld__lrow{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ld__lh{font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin:0 4px 0 10px}
.ld__lh:first-child{margin-left:0}
.ld__checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px 18px;max-height:340px;overflow:auto;padding-top:6px}
.ld__state{display:flex;flex-direction:column;gap:2px}
.ld__chk{display:flex;align-items:center;gap:8px;font-size:14px;padding:3px 0;cursor:pointer;color:var(--paper)}
.ld__chk[hidden]{display:none}
.ld__chk--h{font-weight:600;color:var(--sand,#E6CBAE);border-bottom:1px solid var(--edge);padding-bottom:5px;margin-bottom:3px}
.ld__chk input{accent-color:#C49A74;width:16px!important;min-width:16px;height:16px;flex:0 0 16px;margin:0;padding:0}
.ld__chk{justify-content:flex-start;text-align:left}
.ld__pop--locs input[type=search]{max-width:320px}
.ld__goal{background:var(--panel);border:1px solid var(--edge);border-radius:16px;padding:18px 20px;margin-bottom:14px}
.ld__goal[hidden]{display:none}
.ld__gh{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:baseline;margin-bottom:8px}
.ld__gh b{font:600 20px var(--display);color:var(--paper)}
.ld__gh--s{margin:12px 0 6px;font-size:14px;color:var(--mute)}
.ld__gbar{position:relative;height:14px;border-radius:999px;background:rgba(255,255,255,.07);overflow:visible}
.ld__gbar--s{height:8px}
.ld__gbar i{display:block;height:100%;border-radius:999px;transition:width .6s cubic-bezier(.16,1,.3,1)}
.ld__gbar i.is-ok{background:linear-gradient(90deg,#C49A74,#3FE0A8)}
.ld__gbar i.is-mid{background:linear-gradient(90deg,#C49A74,#E6B65C)}
.ld__gbar i.is-low{background:linear-gradient(90deg,#C49A74,#E0675C)}
.ld__pace{position:absolute;top:-4px;bottom:-4px;width:2px;background:#00B4C5;border-radius:2px}
.ld__gnote{margin:10px 0 0}
@media (max-width:700px){.ld__grp--end{margin-left:0}}

/* sign-in: the MD Esthetics monogram, drawn and revealed */
.gate__mark{position:fixed;right:clamp(30px,9vw,170px);top:50%;transform:translateY(-50%);width:min(340px,26vw);aspect-ratio:1;z-index:2;display:grid;place-items:center}
.gate__mark svg{width:100%;height:100%;overflow:visible}
.gate__ring{fill:none;stroke:rgba(230,203,174,.55);stroke-width:1.2;stroke-dasharray:1200;stroke-dashoffset:1200;animation:gateDraw 2.6s cubic-bezier(.65,0,.35,1) .2s forwards}
.gate__ring--2{stroke:rgba(0,180,197,.45);animation-delay:.6s;animation-duration:3s}
.gate__mono{opacity:0;transform-origin:50% 50%;animation:gateIn 1.6s cubic-bezier(.16,1,.3,1) 1.4s forwards,gateBreath 6s ease-in-out 3.2s infinite}
.gate__word{opacity:0;letter-spacing:.9em;animation:gateWord 1.8s cubic-bezier(.16,1,.3,1) 2s forwards}
.gate__glow{position:absolute;inset:12%;border-radius:50%;background:radial-gradient(circle,rgba(196,154,116,.28),transparent 65%);filter:blur(10px);animation:gateBreath 6s ease-in-out infinite}
@keyframes gateDraw{to{stroke-dashoffset:0}}
@keyframes gateIn{from{opacity:0;transform:scale(.86)}to{opacity:1;transform:scale(1)}}
@keyframes gateWord{to{opacity:.85;letter-spacing:.42em}}
@keyframes gateBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@media (max-width:1200px){.gate__mark{display:none}}
@media (prefers-reduced-motion:reduce){.gate__ring,.gate__mono,.gate__word,.gate__glow{animation:none;opacity:1;stroke-dashoffset:0}}

/* clinic page: Google posts and Meta ads (js/locations.js) */
.locp__posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-top:10px}
.locp__post{display:flex;flex-direction:column;gap:8px;padding:14px}
.locp__post img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;background:rgba(255,255,255,.04)}
.locp__ptext{font-size:14px;line-height:1.5;margin:0;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;white-space:pre-line}
