/* ENCOUNTER v4: LC match panel, filters, profile, map. Uses lifecoordination.com tokens. */
body{pointer-events:auto!important}
#lcMatch{width:100%;margin:0 0 3rem;font-family:var(--font-sans)}
#lcMatch.hidden-panel{display:none}
.lcm-head{text-align:center;margin-bottom:1.5rem}
.lcm-head h2{font-size:1.5rem;font-weight:700}
.lcm-head p{color:hsl(var(--muted-foreground))}
.lcm-tabs{display:flex;justify-content:center;gap:.5rem;margin:1rem 0}
.lcm-tabs button{border:1px solid hsl(var(--border));background:hsl(var(--card));border-radius:999px;padding:.5rem 1.2rem;font-weight:600;cursor:pointer}
.lcm-tabs button.on{background:hsl(var(--primary));color:#fff;border-color:transparent}
.tag{font-size:.7rem;background:hsl(var(--accent) / .15);color:hsl(30 80% 30%);border-radius:6px;padding:.15rem .5rem;font-weight:600;vertical-align:middle}
.btn{display:inline-flex;align-items:center;justify-content:center;background:hsl(var(--primary));color:#fff;border:0;border-radius:.6rem;padding:.7rem 1.4rem;font-weight:600;cursor:pointer;text-decoration:none}
.btn:hover{background:hsl(var(--primary-hover))}
.btn.ghost{background:hsl(var(--muted));color:hsl(var(--foreground))}
.btn.small{padding:.45rem 1rem;font-size:.85rem}
.x{border:0;background:none;font-size:1.4rem;cursor:pointer}
.lcm-toast{position:fixed;left:50%;bottom:1.5rem;transform:translateX(-50%);background:hsl(var(--foreground));color:#fff;padding:.7rem 1.2rem;border-radius:10px;z-index:80}
.hidden{display:none!important}
/* ===== v3 premium ===== */
:root{--navy:hsl(var(--primary));--gold:hsl(var(--primary));--gold2:hsl(260 45% 45%);--cream:#fbf6ea}


.fict{position:absolute;right:12px;top:10px;background:hsl(var(--accent) / .15);color:hsl(30 80% 30%);font-size:.72rem;font-weight:700;padding:.2rem .6rem;border-radius:6px}
.avatar.dm{background:linear-gradient(135deg,hsl(var(--primary)),hsl(260 45% 45%));border:3px solid hsl(var(--primary));font-size:2.4rem}
.avatar.big{width:160px;height:160px;font-size:3.6rem}
.vbadge{display:inline-block;background:#22c55e;color:#fff;font-size:.75rem;font-weight:700;padding:.2rem .6rem;border-radius:999px;margin:.3rem 0}
.sec-head{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;justify-content:center;margin-bottom:.5rem}.sec-head h2{margin:0}
.muted{color:hsl(var(--muted-foreground))}.small{font-size:.8rem}
.filters{background:linear-gradient(180deg,#fff,hsl(var(--muted)))}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1.2rem;margin-top:1.5rem;text-align:left}
.fcard{background:#fff;border-radius:18px;padding:1.3rem;box-shadow:0 6px 24px rgba(55,48,140,.08);border:1px solid hsl(var(--border));position:relative;transition:opacity .35s,transform .35s,max-height .45s;max-height:900px;overflow:hidden}
.fcard.collapsed{opacity:0;transform:scale(.97);max-height:0;padding:0;border:0;margin:0}
.fcard h3{font-size:1rem;margin:0 0 .8rem 2.4rem;text-transform:uppercase;letter-spacing:.06em;color:hsl(var(--primary))}
.fnum{position:absolute;left:1.1rem;top:1.05rem;min-width:28px;height:28px;border-radius:999px;background:hsl(var(--primary));color:hsl(var(--primary));font-weight:800;font-size:.8rem;display:flex;align-items:center;justify-content:center;padding:0 .4rem}
.pchip{border:1.5px solid hsl(var(--border));background:#fff;border-radius:999px;padding:.4rem .9rem;cursor:pointer;font-size:.85rem;transition:all .2s;color:#1d2433}
.pchip:hover{border-color:hsl(var(--primary));transform:translateY(-1px)}
.pchip.on{background:linear-gradient(135deg,hsl(var(--primary)),hsl(260 45% 45%));color:#fff;border-color:transparent;box-shadow:0 4px 12px hsl(var(--primary) / .3)}
.pchip.static{cursor:default;transform:none}
.seg{display:flex;flex-wrap:wrap;background:hsl(var(--muted));border-radius:14px;padding:4px;gap:4px}
.seg button{flex:1 1 auto;border:0;background:none;padding:.55rem .8rem;border-radius:10px;cursor:pointer;font-weight:600;color:#4b5563;transition:all .25s}
.seg button.on{background:#fff;color:hsl(var(--primary));box-shadow:0 2px 8px rgba(0,0,0,.1)}
.azlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.4rem;max-height:220px;overflow:auto}
.az{display:flex;gap:.5rem;align-items:center;text-align:left;border:1px solid #eee;background:#fff;border-radius:10px;padding:.45rem .6rem;cursor:pointer;font-size:.85rem;transition:.2s}
.az b{width:22px;height:22px;border-radius:6px;background:hsl(var(--muted));display:flex;align-items:center;justify-content:center;color:hsl(260 45% 45%)}
.az.on{border-color:hsl(var(--primary));background:hsl(var(--primary) / .07)}
.niche{margin-top:.8rem;padding:.8rem;border-radius:12px;background:hsl(var(--primary) / .07);animation:pop .35s}
.niche .lbl{display:block;margin-bottom:.4rem;font-size:.85rem}
@keyframes pop{from{opacity:0;transform:translateY(-6px)}}
.sliders{display:flex;flex-direction:column;gap:.5rem}
.srow{display:grid;grid-template-columns:150px 1fr 28px;align-items:center;gap:.6rem;font-size:.9rem}
.srow input{accent-color:hsl(var(--primary))}.srow output{font-weight:800;color:hsl(var(--primary))}
.toggle-row{display:flex;align-items:center;gap:.7rem;font-weight:600}
.switch{width:56px;height:30px;border-radius:999px;border:0;background:#d1d5db;position:relative;cursor:pointer;transition:.25s}
.switch i{position:absolute;left:3px;top:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:.25s;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.switch.on{background:#22c55e}.switch.on i{left:29px}
.sub{margin-top:.8rem;transition:opacity .3s;max-height:200px}.sub.collapsed{opacity:0;max-height:0;overflow:hidden;margin:0}
.verse-s{font-style:italic;font-size:.85rem;color:hsl(var(--muted-foreground));margin-bottom:.6rem}
.geo{display:flex;gap:1.5rem;flex-wrap:wrap}
.geo-opt{border:0;background:none;font-size:1.05rem;font-weight:700;color:hsl(var(--primary));cursor:pointer;padding:.4rem 0;border-bottom:3px solid transparent}
.geo-opt.on{border-bottom-color:hsl(var(--primary))}
.fbar{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;align-items:center;margin-top:1.5rem}
.mappanel{position:fixed;left:0;top:0;height:100vh;width:min(440px,92vw);background:#fff;z-index:70;box-shadow:10px 0 40px rgba(0,0,0,.25);padding:1.2rem;transform:translateX(-105%);transition:transform .45s cubic-bezier(.2,.8,.2,1);display:flex;flex-direction:column;gap:.7rem;text-align:left}
.mappanel.open{transform:none}.mp-head{display:flex;justify-content:space-between;align-items:center}.mp-head .x{position:static}
.lamap{width:100%;border-radius:14px}
.pcard{display:grid;grid-template-columns:minmax(260px,1fr) 2.2fr;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 20px 50px rgba(55,48,140,.12);text-align:left;width:100%}
.pc-photo{position:relative;background:radial-gradient(ellipse at top,hsl(260 45% 45%),hsl(var(--primary)));display:flex;align-items:center;justify-content:center;min-height:340px}
.pc-photo .avatar{margin:0}
.online{position:absolute;left:14px;bottom:14px;background:rgba(0,0,0,.5);color:#fff;font-size:.8rem;padding:.25rem .7rem;border-radius:999px}
.online i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#22c55e;margin-right:.3rem}
.pc-body{padding:1.8rem 2rem}.pc-name{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}.pc-name h3{font-size:1.7rem;margin:0}
.bio{margin:1rem 0;font-size:1.02rem}
.pc-cols{display:grid;grid-template-columns:1fr 1fr;gap:2rem;margin-top:1.2rem}.pc-cols h4{margin:.4rem 0;color:hsl(var(--primary));text-transform:uppercase;font-size:.8rem;letter-spacing:.08em}
.pbar{display:grid;grid-template-columns:150px 1fr 24px;gap:.6rem;align-items:center;font-size:.88rem;margin:.35rem 0}
.track2{height:8px;background:hsl(var(--primary) / .12);border-radius:999px;overflow:hidden}.track2 i{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,hsl(var(--primary)),hsl(260 45% 45%))}
.pc-actions{display:flex;gap:.6rem;margin-top:1rem;flex-wrap:wrap}
@media(max-width:800px){.pcard,.pc-cols{grid-template-columns:1fr}.pc-photo{min-height:240px}}

.avatar{width:110px;height:110px;border-radius:50%;background:hsl(var(--primary));color:#fff;font-size:3rem;font-weight:900;display:flex;align-items:center;justify-content:center;margin-bottom:.8rem}
.avatar.dm{background:linear-gradient(135deg,hsl(var(--primary)),hsl(260 45% 45%));border:3px solid hsl(var(--primary));font-size:2.4rem}
.avatar.big{width:160px;height:160px;font-size:3.6rem;margin:0}

.fcard h3{font-size:.85rem}
.pcard{border:1px solid hsl(var(--border))}
.pc-photo{background:linear-gradient(135deg,hsl(var(--primary)),hsl(260 45% 45%))}
.avatar.dm{background:linear-gradient(135deg,hsl(var(--primary)),hsl(260 45% 45%));border-color:#fff}
.mappanel{font-family:var(--font-sans)}
:where(button span.dv){display:block}
.pc-photo img{border-radius:50%;box-shadow:0 10px 30px rgba(0,0,0,.3)}
.lcm-mh{grid-column:1/-1;margin:1.6rem 0 .6rem;color:hsl(var(--primary));text-transform:uppercase;font-size:.8rem;letter-spacing:.08em}
.lcm-match{display:grid;grid-template-columns:44px 1fr 220px;gap:1rem;align-items:center;padding:.8rem 0;border-top:1px solid hsl(var(--border))}
.lcm-match .rank{width:40px;height:40px;border-radius:50%;background:hsl(var(--primary));color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800}
.lcm-match .meter .lbl2{display:flex;justify-content:space-between;font-size:.78rem;font-weight:700;margin-bottom:.25rem}
.road{font-size:.68rem;font-weight:800;border-radius:999px;padding:.1rem .5rem;text-transform:uppercase}
.road.challenged{background:#fde7d1;color:#9a4b12}.road.thriving{background:#d7f5e1;color:#166534}.road.neutral{background:#e5e7eb;color:#374151}
.boost{font-size:.68rem;font-weight:700;border-radius:999px;padding:.1rem .5rem;background:#e8f7ee;color:#166534}
@media(max-width:800px){.lcm-match{grid-template-columns:40px 1fr}.lcm-match .meter{grid-column:1/-1}}
button[data-nav-chrome]{left:0}
.fnum{color:#fff!important;background:hsl(var(--primary))}
.fict{position:absolute;right:12px;top:10px;background:#fff;color:hsl(var(--primary));font-size:.72rem;font-weight:700;padding:.2rem .6rem;border-radius:6px}
.pc-photo{position:relative}
#lcMatch .chips{display:flex;flex-wrap:wrap;gap:.4rem}
.lcm-head p{max-width:900px;margin:0 auto}