/* ============================================================
   PVNTISS — Owners page v2
   Poster-style roster cards + role filter chips.
   Founder gets ONE thing: a gold role badge. Nothing else about
   their card is bigger, glowier, or different from anyone else's.
   ============================================================ */

.owners-head{position:relative;overflow:visible;padding-bottom:10px}
.owners-aura{position:absolute;top:-70px;left:50%;transform:translateX(-50%);width:420px;height:230px;border-radius:50%;
  background:radial-gradient(circle,rgba(124,58,237,.30),rgba(124,58,237,.07) 32%,transparent 50%);
  filter:blur(28px);pointer-events:none;z-index:0}
.owners-head .page-kicker,.owners-head .page-title,.owners-head .page-desc{position:relative;z-index:1}
.owners-title{color:var(--ink)}
.owners-meta{position:relative;z-index:1;display:flex;align-items:center;gap:8px;margin-top:14px;
  font-family:var(--font-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.owners-meta-dot{position:relative;width:6px;height:6px;border-radius:50%;background:#7ee7b2;box-shadow:0 0 8px rgba(126,231,178,.55);flex:none}
.owners-meta-dot::after{content:'';position:absolute;inset:-4px;border-radius:50%;border:1px solid rgba(126,231,178,.4);animation:ownerOrbPulse 2.4s ease-out infinite}
@keyframes ownerOrbPulse{0%{opacity:.9;transform:scale(.7)}100%{opacity:0;transform:scale(2.1)}}

/* ---------- filter chips (new — helps people scan the roster) ---------- */
.owners-filters{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
.owners-filter-chip{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;
  padding:8px 16px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.02);color:var(--dim);cursor:pointer;
  transition:border-color .2s,color .2s,background .2s,transform .2s;
}
.owners-filter-chip:hover{transform:translateY(-1px);color:var(--ink);border-color:rgba(203,182,255,.32)}
.owners-filter-chip.is-active{background:rgba(124,58,237,.14);border-color:rgba(203,182,255,.4);color:var(--purple-bright)}
.owners-filter-chip[data-filter="founder"].is-active{background:rgba(232,179,79,.12);border-color:rgba(232,179,79,.45);color:#e8b34f}

.owners-head::after{content:'';display:block;width:min(100%,1040px);height:1px;margin-top:28px;
  background:linear-gradient(90deg,rgba(203,182,255,.18),rgba(255,255,255,.05),transparent)}

/* ---------- roster grid ---------- */
.owners-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1040px}
@media(max-width:980px){.owners-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.owners-grid{grid-template-columns:repeat(2,1fr);gap:12px}}
@media(max-width:420px){.owners-grid{grid-template-columns:1fr}}

/* poster card: portrait fills the frame, name/badges sit on a scrim at the
   bottom. Every card — founder included — shares this exact structure.
   (resets a couple of legacy circular-card rules still in style.css so
   they can't leak an unwanted top-glow line or center-aligned children in) */
.owner-card::before,.owner-card::after{content:none}
.owner-card{
  position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;
  isolation:auto;min-height:0;width:100%;
  aspect-ratio:3/4;border-radius:20px;overflow:hidden;cursor:pointer;
  background:linear-gradient(160deg,rgba(255,255,255,.03),rgba(255,255,255,0)),var(--card);
  border:1px solid var(--line-soft);
  padding:0;text-align:left;color:inherit;font:inherit;
  opacity:0;animation:ownerCardIn .5s cubic-bezier(.16,1,.3,1) both;
  transition:transform .35s cubic-bezier(.16,1,.3,1),border-color .3s,box-shadow .3s;
  transform-style:preserve-3d;perspective:800px;
}
@keyframes ownerCardIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
.owner-card.pv-tilt{transform:translateY(0) rotateX(var(--pv-ry,0deg)) rotateY(var(--pv-rx,0deg))}
.owner-card:hover{border-color:rgba(203,182,255,.3);box-shadow:0 22px 60px rgba(0,0,0,.45)}
.owner-card:focus-visible{outline:2px solid var(--purple-bright);outline-offset:3px}
.owner-card.is-hidden{display:none}

.owner-card-media{position:absolute;inset:0;z-index:0}
.owner-card-media img,.owner-card-media .owner-avatar-fallback{
  width:100%;height:100%;object-fit:cover;display:block;border-radius:0;margin:0;
  filter:saturate(1.02) contrast(1.02);
  transition:transform .6s cubic-bezier(.16,1,.3,1);
}
.owner-card:hover .owner-card-media img{transform:scale(1.06)}
.owner-card-media .owner-avatar-fallback{
  background:linear-gradient(160deg,var(--purple-deep),#140a26);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-display);font-weight:600;font-size:56px;color:#fff;
}
.owner-card-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(7,6,13,0) 34%,rgba(7,6,13,.55) 62%,rgba(7,6,13,.94) 100%)}

.owner-status-dot{position:absolute;top:12px;right:12px;z-index:2;width:10px;height:10px;border-radius:50%;
  border:2px solid rgba(7,6,13,.85)}
.owner-status-dot[data-status="online"]{background:#7ee7b2}
.owner-status-dot[data-status="idle"]{background:#ffce7a}
.owner-status-dot[data-status="dnd"]{background:#ff8fa8}
.owner-status-dot[data-status="offline"],.owner-status-dot[data-status="unknown"]{background:var(--faint)}
.owner-status-dot[data-status="unknown"]{opacity:.6}
.owner-status-dot[data-status="online"]::after{
  content:'';position:absolute;inset:-4px;border-radius:50%;border:1px solid rgba(126,231,178,.5);
  animation:ownerOrbPulse 2.4s ease-out infinite}

.owner-card-body{position:relative;z-index:2;padding:16px 16px 14px}
.owner-name{font-size:16px;font-weight:600;letter-spacing:-.005em;margin-bottom:2px}
.owner-handle{color:var(--dim);font-size:10.5px;font-family:var(--font-mono);margin-bottom:9px}
.owner-badges{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:10px}
.role-badge{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;
  padding:4px 9px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.03);color:var(--dim);
  transition:transform .2s;white-space:nowrap;
}
.role-badge:hover{transform:scale(1.04)}
/* the ONE thing the founder gets: a gold badge. everything else about
   the card — size, glow, avatar ring, position weight — is identical. */
.role-badge-founder{background:rgba(232,179,79,.12);border-color:rgba(232,179,79,.45);color:#e8b34f}
.role-badge-owner{background:rgba(124,58,237,.1);border-color:rgba(203,182,255,.3);color:var(--purple-bright)}
.role-badge-developer{background:rgba(159,182,255,.1);border-color:rgba(159,182,255,.35);color:var(--soft-blue)}

.owner-socials-cta{display:flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:9.5px;
  letter-spacing:.04em;text-transform:uppercase;color:var(--faint);transition:color .25s,gap .25s}
.owner-card:hover .owner-socials-cta{color:var(--purple-bright);gap:8px}

/* ---------- live activity chip (card) — Spotify / game / custom status ---------- */
.owner-activity{
  display:flex;align-items:center;gap:6px;min-width:0;margin-bottom:9px;
  padding:5px 9px 5px 7px;border-radius:999px;
  background:rgba(255,255,255,.035);border:1px solid var(--line-soft);
  animation:ownerActivityIn .4s cubic-bezier(.16,1,.3,1) both;
}
@keyframes ownerActivityIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.owner-activity-icon{flex:none;width:12px;height:12px;display:flex;color:var(--dim)}
.owner-activity-icon svg{width:100%;height:100%;display:block}
.owner-activity-text{flex:1;min-width:0;font-family:var(--font-mono);font-size:9.5px;letter-spacing:.02em;
  color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Spotify gets its brand green — the one activity kind worth a color call-out */
.owner-activity[data-kind="spotify"]{border-color:rgba(30,215,96,.28);background:rgba(30,215,96,.08)}
.owner-activity[data-kind="spotify"] .owner-activity-icon,
.owner-activity[data-kind="spotify"] .owner-activity-text{color:#4fe07f}
.owner-activity[data-kind="custom"] .owner-activity-icon{color:#e8b34f}

/* ---------- modal "now playing / now doing" card ---------- */
.owner-modal-activity-slot{position:relative;z-index:1}
.owner-activity-card{
  position:relative;z-index:1;display:flex;align-items:center;gap:12px;text-align:left;
  margin:-4px 0 18px;padding:10px 14px;border-radius:16px;text-decoration:none;color:inherit;
  background:rgba(255,255,255,.03);border:1px solid var(--line-soft);
  transition:transform .2s,border-color .2s,background .2s;
}
a.owner-activity-card:hover{transform:translateY(-2px);border-color:rgba(203,182,255,.3);background:rgba(124,58,237,.08)}
.owner-activity-card[data-kind="spotify"]{border-color:rgba(30,215,96,.25);background:rgba(30,215,96,.07)}
a.owner-activity-card[data-kind="spotify"]:hover{border-color:rgba(30,215,96,.45);background:rgba(30,215,96,.12)}
.owner-activity-art{width:42px;height:42px;border-radius:10px;object-fit:cover;flex:none;
  box-shadow:0 4px 14px rgba(0,0,0,.35)}
.owner-activity-art-fallback{display:flex;align-items:center;justify-content:center;color:var(--dim);
  background:linear-gradient(160deg,var(--purple-deep),#140a26)}
.owner-activity-art-fallback svg{width:18px;height:18px}
.owner-activity-art-fallback[data-kind="spotify"]{color:#4fe07f;background:rgba(30,215,96,.12)}
.owner-activity-info{min-width:0;flex:1}
.owner-activity-kicker{display:flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:9px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin-bottom:3px}
.owner-activity-kicker svg{width:10px;height:10px;display:block}
.owner-activity-kicker[data-kind="spotify"]{color:#4fe07f}
.owner-activity-kicker[data-kind="custom"]{color:#e8b34f}
.owner-activity-title{font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.owner-activity-sub{font-size:11.5px;color:var(--dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}

/* ---------- modal (same content, refined shell) ---------- */
.owner-modal-overlay{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  padding:24px;background:rgba(4,3,10,.75);backdrop-filter:blur(10px);animation:fadeIn .25s ease both}
.owner-modal-overlay[hidden]{display:none}
.owner-modal{position:relative;width:min(440px,100%);
  background:linear-gradient(180deg,rgba(28,20,46,.97),rgba(13,9,22,.97));
  border:1px solid rgba(203,182,255,.22);border-radius:24px;padding:40px 28px 30px;text-align:center;
  box-shadow:0 30px 90px rgba(0,0,0,.6),0 0 0 1px rgba(203,182,255,.05);
  animation:modalIn .35s cubic-bezier(.16,1,.3,1) both}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.owner-modal-glow{position:absolute;top:-60px;left:50%;transform:translateX(-50%);width:220px;height:220px;border-radius:50%;
  background:radial-gradient(circle,rgba(124,58,237,.4),rgba(124,58,237,.1) 30%,transparent 48%);filter:blur(20px);
  pointer-events:none;z-index:0}
#ownerModal[data-accent="founder"] .owner-modal-glow{background:radial-gradient(circle,rgba(232,179,79,.4),rgba(232,179,79,.1) 30%,transparent 48%)}
.owner-modal-close{position:absolute;top:14px;right:16px;z-index:2;background:rgba(255,255,255,.04);
  border:1px solid var(--line);color:var(--dim);width:30px;height:30px;border-radius:50%;font-size:13px;
  line-height:1;cursor:pointer;transition:color .2s,border-color .2s,transform .2s}
.owner-modal-close:hover{color:#fff;border-color:var(--purple-bright);transform:rotate(90deg)}
.owner-modal-avatar{position:relative;z-index:1;margin-bottom:16px}
.owner-modal-avatar-wrap{position:relative;display:inline-block}
.owner-modal-avatar-wrap .owner-status-dot{width:20px;height:20px;top:auto;right:2px;bottom:2px;border-width:3px}
.owner-modal-avatar-img{width:96px;height:96px;object-fit:cover;margin:0 auto;border-radius:50%;
  border:1px solid rgba(203,182,255,.3);box-shadow:0 0 0 6px rgba(124,58,237,.12),0 8px 30px rgba(0,0,0,.5)}
.owner-modal-avatar-fallback{width:96px;height:96px;margin:0 auto;border-radius:50%;
  background:linear-gradient(160deg,var(--purple-deep),#140a26);color:#fff;display:flex;align-items:center;
  justify-content:center;font-family:var(--font-display);font-weight:600;font-size:36px;
  border:1px solid rgba(203,182,255,.3);box-shadow:0 0 0 6px rgba(124,58,237,.12)}
.owner-modal-name{position:relative;z-index:1;font-size:22px;font-weight:600;letter-spacing:-.01em;margin-bottom:4px}
.owner-modal-handle{position:relative;z-index:1;color:var(--faint);font-size:13px;font-family:var(--font-mono);margin-bottom:18px}
.owner-modal-status-pill{margin:-6px 0 16px;position:relative;z-index:1}
.owner-status-pill{position:relative;z-index:1;display:inline-flex;align-items:center;gap:7px;
  padding:6px 14px 6px 11px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.03);
  font-family:var(--font-mono);font-size:10.5px;color:var(--dim);transition:border-color .2s}
.owner-status-pill:hover{border-color:rgba(203,182,255,.28)}
.owner-status-orb{position:relative;width:7px;height:7px;border-radius:50%;flex:none;background:var(--faint);box-shadow:none;
  transition:background .3s ease,box-shadow .3s ease}
.owner-status-pill[data-status="online"] .owner-status-orb{background:#7ee7b2;box-shadow:0 0 9px rgba(126,231,178,.65)}
.owner-status-pill[data-status="idle"] .owner-status-orb{background:#ffce7a;box-shadow:0 0 8px rgba(255,206,122,.55)}
.owner-status-pill[data-status="dnd"] .owner-status-orb{background:#ff8fa8;box-shadow:0 0 8px rgba(255,143,168,.55)}
.owner-status-pill[data-status="offline"] .owner-status-orb,.owner-status-pill[data-status="unknown"] .owner-status-orb{background:var(--faint)}
.owner-modal-badges{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:22px}
.owner-modal-bio{position:relative;z-index:1;color:var(--dim);font-size:14px;line-height:1.5;max-width:320px;margin:0 auto 20px}
.owner-modal-divider{height:1px;background:linear-gradient(90deg,transparent,rgba(203,182,255,.18),transparent);margin:0 0 22px}
.social-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.social-btn{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;
  background:rgba(255,255,255,.03);border:1px solid var(--line-soft);text-decoration:none;color:var(--ink);
  transition:transform .2s,border-color .2s,background .2s;min-width:0}
.social-btn:hover{transform:translateY(-2px);border-color:var(--social-color,#7c3aed);background:rgba(124,58,237,.1)}
.social-btn-icon{width:22px;height:22px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.social-btn-icon svg{width:100%;height:100%;display:block}
.social-btn-label{flex:1;font-size:13px;font-weight:500;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.social-btn-arrow{color:var(--faint);font-size:13px;flex-shrink:0;transition:color .2s,transform .2s}
.social-btn:hover .social-btn-arrow{color:var(--social-color,#cbb6ff);transform:translate(2px,-2px)}
@media(max-width:420px){.social-grid{grid-template-columns:1fr}}

.empty-note{font-family:var(--font-mono);font-size:12px;color:var(--faint);padding:30px 4px}

@media(prefers-reduced-motion:reduce){
  .owner-card{animation:none;opacity:1}
  .owner-card-media img{transition:none}
}

/* Team directory and signed-in workspace */
.owners-intro{max-width:580px;color:var(--dim);font-size:15px;line-height:1.8;margin-top:20px}
.owners-workspace{max-width:1040px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px;margin:20px 0 30px;border:1px solid rgba(203,182,255,.25);border-radius:20px;background:linear-gradient(120deg,rgba(124,58,237,.18),rgba(255,255,255,.02))}
.owners-workspace[hidden],.owners-no-results[hidden],.owners-filters[hidden]{display:none}
.workspace-kicker{font:10px var(--font-mono);letter-spacing:.15em;color:var(--purple-bright)}
.owners-workspace h2{font-size:21px;margin:10px 0}.owners-workspace p{color:var(--dim);font-size:13px}
.workspace-actions{display:flex;flex-wrap:wrap;gap:10px}
.owner-action{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 14px;border:1px solid var(--line);border-radius:11px;background:rgba(255,255,255,.04);color:var(--ink);text-decoration:none;font:12px var(--font-mono);cursor:pointer;transition:background .2s,transform .2s}
.owner-action:hover{background:rgba(124,58,237,.2);transform:translateY(-2px)}.owner-action.primary{background:#7541db;color:#fff;border-color:#9768ed}
.owners-toolbar{display:flex;align-items:end;gap:16px;max-width:1040px;margin:26px 0 12px}.owner-search{flex:1}.owners-toolbar label{display:grid;gap:9px;font:11px var(--font-mono);color:var(--dim)}
.owners-toolbar input,.owners-toolbar select{min-height:46px;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:var(--card);color:var(--ink);font:13px var(--font-body,Inter,sans-serif);width:100%;min-width:0}.owners-toolbar select{color-scheme:dark}
.owner-view{display:flex;border:1px solid var(--line);border-radius:12px;padding:4px;gap:4px}.owner-view button{min-height:36px;border:0;border-radius:8px;background:transparent;color:var(--dim);padding:8px 14px;cursor:pointer}.owner-view button[aria-pressed="true"]{background:rgba(124,58,237,.24);color:var(--purple-bright)}
.owners-results{font:11px var(--font-mono);color:var(--dim);line-height:1.6;margin:14px 0 22px;overflow-wrap:anywhere}.owners-no-results{max-width:1040px;text-align:center;padding:55px 20px;border:1px dashed var(--line);border-radius:20px}.owners-no-results h2{font-size:20px}.owners-no-results p{color:var(--dim);margin:14px 0 24px}
.owner-card{aspect-ratio:4/5;border-radius:22px}.owner-card-body{padding:22px}.owner-name{font-size:20px}.owner-socials-cta{padding-top:12px;border-top:1px solid rgba(255,255,255,.12);color:#cdb9ef}.owner-handle{color:#bdb0d5}.owner-card-scrim{background:linear-gradient(180deg,transparent 15%,rgba(7,6,13,.42) 45%,rgba(7,6,13,.97) 100%)}
.owners-list .owners-grid{grid-template-columns:1fr 1fr}.owners-list .owner-card{aspect-ratio:auto;min-height:180px;padding-left:135px}.owners-list .owner-card-media{width:135px}.owners-list .owner-card-scrim{background:linear-gradient(90deg,transparent,rgba(7,6,13,.3) 120px,rgba(7,6,13,.88) 140px)}.owners-list .owner-card-body{padding:20px}.owners-list .owner-name{font-size:18px}
.owner-modal{max-height:calc(100dvh - 48px);overflow-y:auto}.owner-modal-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin:16px 0}.owner-modal-controls .owner-action{font-size:10px;padding:8px 10px}
.owners-toolbar :focus-visible,.owner-action:focus-visible,.owner-view button:focus-visible{outline:2px solid var(--purple-bright);outline-offset:3px}
#authArea{display:flex;align-items:center;gap:10px}
@media(max-width:700px){.owners-workspace{align-items:flex-start;flex-direction:column}.owners-toolbar{flex-wrap:wrap}.owner-search{flex-basis:100%}.owner-status-filter{flex:1}.owners-list .owners-grid{grid-template-columns:1fr}.owner-card-body{padding:16px}.owners-meta{font-size:9px;line-height:1.8}}
@media(prefers-reduced-motion:reduce){.owner-action,.owner-card,.owner-card-media img{transition:none}.owner-status-dot::after,.owners-meta-dot::after{animation:none}.owner-modal-overlay,.owner-modal,.owner-activity,.owner-activity-card{animation:none}}
