/* Jabree Hub theme: black and white like the Jabree mark. Loaded after styles.css, so it wins. */
:root{ --accent:#121212; --accent-deep:#9a938a; --on-accent:#ffffff; }
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){ --accent:#f3f0ea; --accent-deep:#7f786f; --on-accent:#121212; }}
:root[data-theme="dark"]{ --accent:#f3f0ea; --accent-deep:#7f786f; --on-accent:#121212; }

/* The mark, drawn from mark.svg in whatever color the tile text is */
.logo-tile{color:var(--on-cta)!important;font-size:0!important;position:relative}
.logo-tile::before{content:"";position:absolute;inset:18% 28%;background:currentColor;-webkit-mask:url(/mark.svg) center/contain no-repeat;mask:url(/mark.svg) center/contain no-repeat}

/* Spots that used yellow on black now use the plain CTA pair */
.av{background:var(--sel);color:var(--ink)}
.tabbar .plus,.drop .ic,.send{color:var(--on-cta)}
.cta .go{background:var(--on-cta);color:var(--cta)}
.glass{white-space:nowrap}
.glass.lime{background:#fff;color:#121212}

/* Charts: gray for spend and subscribers, a light wash for the area */
svg path[fill="var(--accent)"]{fill:var(--ink);opacity:.07}
svg rect[fill="var(--accent-deep)"]{fill:var(--ink)}

/* Password sign-in */
.pwform{display:grid;gap:8px}
.pwform input{border:0;background:var(--tile);border-radius:999px;padding:0 18px;height:52px;font-size:16px;outline:none;color:var(--ink);width:100%;box-sizing:border-box}
.pwform input:focus{box-shadow:0 0 0 2px var(--ink)}
.pwform .cta{justify-self:start}
.linkbtn{background:none;border:0;padding:0;color:var(--ink-2);font:inherit;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer;align-self:flex-start}
.more-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.cta.wide{justify-self:stretch;justify-content:space-between}
:root{--ch-shoot:#2f8f83}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--ch-shoot:#5cc2b4}}
:root[data-theme="dark"]{--ch-shoot:#5cc2b4}

/* ---------- Clay pieces (sign-in, intro, Clips buttons) ---------- */
:root{
  --clay1:#f4f0ea; --clay1-hi:#ffffff; --clay2:#e2dbd0; --clay2-hi:#f1ece4; --clay3:#c7beb1; --clay3-hi:#dad3c8; --clay4:#2d2a27; --clay4-hi:#47423d;
  --clay-ink:#2d2a27; --clay-pl-dark:#f4f0ea;
  --box-front:#2b2826; --box-front-hi:#423d39; --box-back:#1e1c1a; --box-side:#3a3632; --box-mark:#514b46;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --clay4:#5d5751; --clay4-hi:#77706a; --box-front:#d8d0c4; --box-front-hi:#eae4da; --box-back:#a79f94; --box-side:#bdb5a9; --box-mark:#b7aea2;
}}
:root[data-theme="dark"]{ --clay4:#5d5751; --clay4-hi:#77706a; --box-front:#d8d0c4; --box-front-hi:#eae4da; --box-back:#a79f94; --box-side:#bdb5a9; --box-mark:#b7aea2; }

.cp{--base:var(--clay1);--hi:var(--clay1-hi);--pl:var(--clay3);position:relative;display:grid;place-items:center;border-radius:1.5em;color:var(--clay-ink);
  background:linear-gradient(150deg,var(--hi) 0%,var(--base) 62%);
  box-shadow:inset .45em .5em .9em rgba(255,255,255,.6),inset -.45em -.55em .9em rgba(60,45,30,.16),0 .7em 1.3em rgba(40,30,20,.16),0 .15em .3em rgba(40,30,20,.12)}
.cp.t2{--base:var(--clay2);--hi:var(--clay2-hi);--pl:var(--clay4)}
.cp.t3{--base:var(--clay3);--hi:var(--clay3-hi);--pl:var(--clay1)}
.cp.t4{--base:var(--clay4);--hi:var(--clay4-hi);--pl:var(--clay-pl-dark);color:var(--clay-pl-dark);box-shadow:inset .45em .5em .9em rgba(255,255,255,.12),inset -.45em -.55em .9em rgba(0,0,0,.35),0 .7em 1.3em rgba(20,15,10,.22),0 .15em .3em rgba(20,15,10,.15)}
.cp .pl{width:50%;height:auto;color:var(--pl);filter:drop-shadow(.06em .1em .08em rgba(0,0,0,.25)) drop-shadow(-.04em -.05em .05em rgba(255,255,255,.35))}
.cp.sq{width:6.4em;height:6.4em}
.cp.tall{width:5.4em;height:9em;border-radius:1.4em}
.cp.wide{width:9.4em;height:6em;border-radius:1.4em}

/* ---------- Sign-in page ---------- */
.gate{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(14px,3vh,30px);padding:calc(32px + env(safe-area-inset-top,0px)) 20px calc(28px + env(safe-area-inset-bottom,0px));background:radial-gradient(120% 70% at 50% 42%,var(--panel) 0%,var(--canvas) 70%);overflow:hidden}
.wordmark{position:relative;z-index:2;margin:0;font-size:clamp(40px,10.5vw,76px);font-weight:700;letter-spacing:-.045em;line-height:.95;text-align:center;color:var(--ink)}
.gate-actions{width:min(360px,100%);display:flex;flex-direction:column;align-items:stretch;gap:12px;min-height:118px}
.gate-actions .linkbtn{align-self:center}
.gate-links{display:flex;justify-content:center;gap:22px}
.gate-note{margin:0;text-align:center;color:var(--ink-2);font-size:14.5px}

.claystage{--w:min(420px,92vw);font-size:calc(var(--w) / 38);width:38em;height:27em;position:relative;z-index:1;perspective:70em;perspective-origin:50% 10%}
.cfloor{position:absolute;left:12%;right:12%;bottom:1.2em;height:3.4em;border-radius:50%;background:radial-gradient(closest-side,rgba(40,30,20,.22),transparent);filter:blur(.4em)}
.cscene{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(-14deg) rotateY(0deg);animation:clayTurn 18s ease-in-out 3.4s infinite alternate}
.cin{position:absolute;left:5em;right:5em;bottom:3em;height:26em;transform-style:preserve-3d}
.cpw{position:absolute;transform:translateX(-50%) translateZ(var(--z,0));transform-style:preserve-3d}
.cwall{position:absolute;border-radius:1.6em}
.cwall.front{left:5em;right:5em;bottom:3em;height:9.5em;transform:translateZ(3.2em);background:linear-gradient(160deg,var(--box-front-hi),var(--box-front) 60%);box-shadow:inset .5em .6em 1em rgba(255,255,255,.14),inset -.5em -.6em 1em rgba(0,0,0,.28),0 1em 1.8em rgba(30,20,10,.18)}
.cwall.front::after{content:"";position:absolute;left:50%;top:50%;width:3.6em;height:6.2em;transform:translate(-50%,-50%);background:var(--box-mark);-webkit-mask:url(/mark.svg) center/contain no-repeat;mask:url(/mark.svg) center/contain no-repeat;filter:drop-shadow(.06em .08em .05em rgba(0,0,0,.35))}
.cwall.back{left:5em;right:5em;bottom:3.4em;height:11em;transform:translateZ(-3.2em);background:linear-gradient(180deg,var(--box-front-hi),var(--box-back));box-shadow:inset 0 .8em 1.2em rgba(0,0,0,.3)}
.cp.fall{transform-origin:50% 100%;animation:clayDrop 1.05s var(--d,0s) both}
@keyframes clayDrop{
  0%{transform:translateY(-32em) rotate(calc(var(--r) * -2));opacity:0;animation-timing-function:cubic-bezier(.55,0,.85,.35)}
  8%{opacity:1}
  60%{transform:translateY(0) rotate(var(--r)) scale(1.08,.86);animation-timing-function:cubic-bezier(.2,.7,.3,1)}
  74%{transform:translateY(-1.3em) rotate(calc(var(--r) * .7)) scale(.97,1.04);animation-timing-function:cubic-bezier(.6,0,.8,.4)}
  86%{transform:translateY(0) rotate(var(--r)) scale(1.03,.95)}
  94%{transform:translateY(-.3em) rotate(var(--r)) scale(1,1)}
  100%{transform:translateY(0) rotate(var(--r)) scale(1,1);opacity:1}
}
@keyframes clayTurn{from{transform:rotateX(-14deg) rotateY(0deg)}to{transform:rotateX(-17deg) rotateY(-22deg)}}

/* ---------- Intro after first sign in ---------- */
.intro{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:calc(20px + env(safe-area-inset-top,0px)) 20px calc(24px + env(safe-area-inset-bottom,0px));background:radial-gradient(120% 70% at 50% 35%,var(--panel) 0%,var(--canvas) 70%)}
.ob-top{width:min(460px,100%);display:flex;justify-content:space-between;align-items:center}
.ob-kicker{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
.ob-card{flex:1;width:min(460px,100%);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:14px;padding:24px 0;animation:obIn .45s cubic-bezier(.2,.7,.3,1) both}
.ob-card h1{margin:6px 0 0;font-size:clamp(28px,7vw,36px);font-weight:600;letter-spacing:-.03em;line-height:1.1;text-wrap:balance}
.ob-card p{margin:0;color:var(--ink-2);font-size:16.5px;line-height:1.45;max-width:36ch}
.ob-new{background:var(--cta);color:var(--on-cta);font-size:12px;font-weight:600;border-radius:999px;padding:4px 10px}
@keyframes obIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.ob-art{font-size:12px;position:relative;width:20em;height:15em;margin-bottom:6px}
.ob-main{position:absolute;left:50%;top:50%;width:10em;height:10em;margin:-5em 0 0 -5em;border-radius:2.6em;animation:obFloat 5s ease-in-out infinite}
.ob-main svg{width:4.4em;height:4.4em;stroke-width:1.8}
.ob-a{position:absolute;left:1.2em;top:1.6em;transform:rotate(-12deg) scale(.62);animation:obFloat 6s ease-in-out .6s infinite}
.ob-b{position:absolute;right:.6em;top:.2em;transform:rotate(10deg) scale(.6);animation:obFloat 5.5s ease-in-out 1.2s infinite}
.ob-c{position:absolute;right:1.4em;bottom:.2em;transform:rotate(-6deg) scale(.55);animation:obFloat 6.5s ease-in-out .3s infinite}
@keyframes obFloat{0%,100%{translate:0 0}50%{translate:0 -.6em}}
.ob-welcome .logo-tile{width:96px;height:96px;border-radius:28px;box-shadow:var(--lift)}
.ob-list,.ob-points{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;width:min(320px,100%);text-align:left}
.ob-list li{display:flex;align-items:center;gap:12px;background:var(--panel);box-shadow:var(--ring);border-radius:16px;padding:12px 14px;font-weight:500}
.ob-ic{width:30px;height:30px;border-radius:10px;background:var(--tile);display:grid;place-items:center;flex:none}
.ob-ic svg{width:18px;height:18px}
.ob-points li{display:flex;align-items:center;gap:10px;color:var(--ink-2);font-size:15px}
.ob-points li svg{width:18px;height:18px;color:var(--success);flex:none}
.ob-foot{width:min(460px,100%);display:flex;align-items:center;justify-content:space-between;gap:12px}
.ob-dots{display:flex;gap:6px}
.ob-dots i{width:7px;height:7px;border-radius:9px;background:var(--line-2);transition:width .25s}
.ob-dots i.on{width:22px;background:var(--ink)}
.ob-btns{display:flex;gap:8px;align-items:center}

/* ---------- Clips: Upload and Browse ---------- */
.bigbtns{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0 8px}
.bigbtn{font-size:10px;border:0;border-radius:30px;padding:22px;min-height:220px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;background:var(--panel);color:var(--ink);box-shadow:var(--ring);cursor:pointer;transition:transform .15s,box-shadow .15s}
.bigbtn:hover{box-shadow:var(--lift)}
.bigbtn:active{transform:scale(.98)}
.bigbtn.dark{background:var(--cta);color:var(--on-cta)}
.bigbtn .bi{width:6.6em;height:6.6em;border-radius:2em;margin-bottom:auto}
.bigbtn .bi svg{width:3em;height:3em;stroke-width:1.9}
.bigbtn b{font-size:26px;font-weight:600;letter-spacing:-.025em;margin-top:18px}
.bigbtn > span:last-child{font-size:14.5px;opacity:.72;line-height:1.35}
.tabbar.four{grid-template-columns:repeat(4,1fr)}

/* ---------- Top bar: notifications and settings ---------- */
.topbar{display:flex;justify-content:space-between;align-items:center;margin:-8px 0 14px;min-height:40px}
.tb-logo{visibility:hidden;padding:0}
.tb-logo .logo-tile{width:34px;height:34px;border-radius:10px}
.tb-r{display:flex;gap:8px}
.tb-btn{position:relative;background:var(--panel);box-shadow:var(--ring)}
.tb-btn .dot{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:11px;font-weight:600;display:grid;place-items:center;box-shadow:0 0 0 2px var(--canvas)}
.side-foot .me{border:0;background:none;width:100%;text-align:left;cursor:pointer;border-radius:14px;padding:8px;color:var(--ink);font:inherit}
.side-foot .me:hover{background:var(--tile)}
.setrow{display:flex;flex-direction:column;gap:8px}
.setrow .glabel{margin:0}
.setlist{background:var(--tile);box-shadow:none;border-radius:18px}
.setlist .row svg{width:19px;height:19px;flex:none}
.setlist .row svg:last-child{width:16px;height:16px;color:var(--ink-3)}
.notes{display:flex;flex-direction:column;gap:6px}
.note-row{display:flex;gap:12px;align-items:flex-start;border:0;background:none;text-align:left;padding:12px;border-radius:16px;width:100%;color:var(--ink);font:inherit;cursor:pointer}
.note-row:hover{background:var(--tile)}
.note-row.new{background:var(--tile)}
.note-row.new .t1::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--danger);margin-right:7px;vertical-align:1px}
.note-row .main-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.note-row .t1{font-size:14px}
.note-row .tx{font-size:14px;color:var(--ink-2)}
.note-row .hint{font-size:12px}
.mention{font-weight:600;color:var(--ink);background:var(--tile);border-radius:6px;padding:0 3px}

/* ---------- Browse: folders and one filter menu ---------- */
.btool .actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.fwrap{position:relative}
.fwrap>.btn svg{width:16px;height:16px}
.fpanel{position:absolute;right:0;top:calc(100% + 8px);z-index:25;width:min(380px,calc(100vw - 32px));background:var(--panel);border-radius:22px;box-shadow:var(--lift);padding:14px;display:flex;flex-direction:column;gap:12px}
.fpanel .group{margin:0}
.fshow{display:flex;flex-wrap:wrap;width:100%}
.fshow button{flex:1 1 auto}
.factions{display:flex;justify-content:space-between;gap:8px}
.folders{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:22px 18px}
.folder{border:0;background:none;padding:0;text-align:left;display:flex;flex-direction:column;gap:3px;cursor:pointer;color:var(--ink);font:inherit}
.folder b{font-size:15px;font-weight:600;letter-spacing:-.01em;margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.folder>span:last-child{font-size:13px;color:var(--ink-3)}
.fshape{position:relative;aspect-ratio:5/4;display:block;transition:transform .25s cubic-bezier(.2,.8,.2,1)}
.folder:hover .fshape{transform:translateY(-3px)}
.ftab{position:absolute;left:0;top:0;width:44%;height:16%;border-radius:12px 14px 0 0;background:var(--folder-back)}
.fbody{position:absolute;left:0;right:0;bottom:0;top:9%;border-radius:4px 16px 16px 16px;background:linear-gradient(180deg,var(--folder-hi),var(--folder));box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 22px rgba(40,30,20,.12),0 2px 5px rgba(40,30,20,.08);padding:9px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:5px}
.fth{position:relative;border-radius:9px;overflow:hidden;background:rgba(0,0,0,.05)}
.fth .thumbimg,.fth .scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
:root{--folder:#e7e2da;--folder-hi:#f3efe9;--folder-back:#d5cec3}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--folder:#2c2a27;--folder-hi:#383532;--folder-back:#4a4642}}
:root[data-theme="dark"]{--folder:#2c2a27;--folder-hi:#383532;--folder-back:#4a4642}
.fhead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 16px}
.fhead h2{margin:0;font-size:22px;font-weight:600;letter-spacing:-.02em}
.vcard .glass.fav{padding:3px 6px;color:#fff}
.vcard .glass.fav svg{width:12px;height:12px}

/* ---------- Reel: favorites, scrubber, timestamped comments, mentions ---------- */
.rail button.fav.on{color:#ff4d6d}
.feedsort{display:flex;background:rgba(255,255,255,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:999px;padding:3px}
.feedsort button{border:0;background:none;color:rgba(255,255,255,.8);font:inherit;font-size:13.5px;font-weight:500;padding:7px 14px;border-radius:999px;cursor:pointer}
.feedsort button[aria-pressed="true"]{background:#fff;color:#121212}
.scrub{position:absolute;left:0;right:0;bottom:0;height:20px;cursor:pointer;z-index:3}
.scrub::before{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.25)}
.scrub .fill{position:absolute;left:0;bottom:0;height:3px;width:0;background:#fff;transition:width .2s linear}
.scrub .marks i{position:absolute;bottom:-2px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.45)}
.scrub:hover::before,.scrub:hover .fill{height:5px}
.sinfo{bottom:22px}
.rail{bottom:24px}
.tschip{border:0;border-radius:8px;padding:2px 7px;margin-right:6px;font:600 12px/1.6 var(--f-mono);background:var(--tile);color:var(--ink-2);cursor:pointer;vertical-align:1px}
.tschip:hover{background:var(--sel)}
.compose .tschip{flex:none;height:34px;padding:0 10px;border-radius:999px;margin:0;opacity:.55}
.compose .tschip.on{background:var(--cta);color:var(--on-cta);opacity:1}
.reel-panel{position:relative}
.mpop{position:absolute;left:16px;right:16px;bottom:calc(70px + env(safe-area-inset-bottom,0px));background:var(--panel);border-radius:16px;box-shadow:var(--lift);padding:6px;display:flex;flex-direction:column;z-index:5}
.mpop[hidden]{display:none}
.mpop button{display:flex;align-items:center;gap:10px;border:0;background:none;padding:8px 10px;border-radius:12px;text-align:left;font:inherit;font-weight:500;color:var(--ink);cursor:pointer}
.mpop button .hint{margin-left:auto;font-size:12px}
.mpop button.on,.mpop button:hover{background:var(--tile)}

@media (max-width:860px){
  .tb-logo{visibility:visible}
  .topbar{margin-top:-14px}
  .fpanel{position:fixed;left:12px;right:12px;width:auto;top:auto;bottom:calc(92px + env(safe-area-inset-bottom,0px))}
  .folders{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}
  .bigbtns{gap:10px;margin-top:18px}
  .bigbtn{min-height:180px;padding:18px;border-radius:26px}
  .bigbtn b{font-size:22px}
}
@media (prefers-reduced-motion: reduce){
  .cscene,.cp.fall,.ob-main,.ob-a,.ob-b,.ob-c,.ob-card{animation:none!important}
}

/* ---------- Select and download ---------- */
.selmark{position:absolute;top:9px;right:9px;z-index:2;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;border:2px solid #fff;background:rgba(0,0,0,.25);color:#121212;box-shadow:0 1px 4px rgba(0,0,0,.3);font:600 12px/1 var(--f-sans,inherit);padding:0}
.selmark svg{width:15px;height:15px;stroke-width:2.6}
.vcard.picking .top>span:last-child{visibility:hidden}
.vcard.picking.on .selmark{background:#fff}
.vcard.picking.on{box-shadow:0 0 0 3px var(--ink);transform:scale(.97)}
.vcard.picking:hover{transform:none}
.vcard.picking.on:hover{transform:scale(.97)}
.ftile{position:relative;display:flex;flex-direction:column}
.ftile .folder{flex:1}
.ftile .fsel{top:14%;right:8px;cursor:pointer;color:var(--ink);border-color:var(--ink);background:var(--panel);box-shadow:var(--ring)}
.ftile .fsel.part{background:var(--tile)}
.ftile .fsel.full{background:var(--ink);color:var(--canvas)}
.fhead .fdl{margin-left:auto}
.selbar{position:fixed;z-index:28;left:calc(252px + (100vw - 252px) / 2);translate:-50% 0;bottom:24px;display:flex;align-items:center;gap:10px;background:var(--panel);border-radius:999px;box-shadow:var(--lift);padding:6px 6px 6px 20px;max-width:calc(100vw - 284px);animation:obIn .25s ease both}
.selbar .sb-n{font-size:14px;white-space:nowrap;margin-right:6px}
.selbar .sb-n .hint{margin-left:4px}
.selbar .cta[disabled]{opacity:.4}
#dlHost{position:fixed;z-index:85;left:50%;transform:translateX(-50%);bottom:calc(150px + env(safe-area-inset-bottom,0px));width:min(420px,calc(100vw - 24px))}
.dlpill{display:flex;align-items:center;gap:10px;background:var(--panel);color:var(--ink);border-radius:20px;box-shadow:var(--lift);padding:8px 8px 8px 16px}
.dlpill .dlt{font-size:14px;font-weight:500;flex:none;max-width:60%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dlpill .dlbar{flex:1;height:5px;border-radius:5px;background:var(--tile);overflow:hidden;min-width:40px}
.dlpill .dlbar i{display:block;height:100%;background:var(--ink);transition:width .2s}
.dlpill .iconbtn{width:32px;height:32px;flex:none}
.dlpill .iconbtn svg{width:16px;height:16px}
@media (min-width:861px){#dlHost{left:calc(252px + (100vw - 252px) / 2);bottom:90px}}
@media (max-width:860px){
  .selbar{left:12px;right:12px;translate:none;max-width:none;bottom:calc(88px + env(safe-area-inset-bottom,0px));padding-left:16px}
  .selbar .sb-n{flex:1;margin:0}
  .fhead .fdl{margin-left:0}
}

/* ---------- Team page: seasons ---------- */
.person .pinfo{min-width:0;display:flex;flex-direction:column;gap:2px}
.schips{margin-top:7px}
.schips .chip{padding:4px 10px;font-size:12.5px}
.schips .chip svg{width:12px;height:12px}
.toolbar .newcamp{display:flex;gap:6px;align-items:center}
.toolbar .newcamp input{border:0;background:var(--tile);border-radius:999px;height:34px;padding:0 14px;font:inherit;font-size:14px;color:var(--ink);outline:none;width:150px}
.invite .setrow{gap:6px}

/* ---------- Team analytics ---------- */
.crewlist{background:var(--panel);border-radius:22px;box-shadow:var(--ring);overflow:hidden}
.crew{border-top:1px solid var(--line)}
.crew:first-child{border-top:0}
.crew-h{display:grid;grid-template-columns:auto minmax(120px,1.4fr) minmax(60px,1fr) 70px 100px 60px;align-items:center;gap:14px;width:100%;border:0;background:none;padding:13px 18px;text-align:left;color:var(--ink);font:inherit;cursor:pointer}
.crew-h:hover,.crew.open .crew-h{background:var(--tile)}
.cw-who{min-width:0;display:flex;flex-direction:column;gap:2px}
.cw-who b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw-who span{font-size:12.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw-bar{height:6px;border-radius:6px;background:var(--tile);overflow:hidden}
.crew.open .cw-bar,.crew-h:hover .cw-bar{background:var(--panel)}
.cw-bar i{display:block;height:100%;background:var(--ink);border-radius:6px}
.cw-st{display:flex;flex-direction:column;align-items:flex-end;gap:1px;text-align:right}
.cw-st b{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.cw-st small{font-size:11.5px;color:var(--ink-3);white-space:nowrap}
.crew-d{padding:6px 18px 18px;display:flex;flex-direction:column;gap:10px;background:var(--tile)}
.crew-d .glabel{margin:6px 0 8px;display:block}
.cw-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:24px}
.gearlist{display:flex;flex-direction:column;gap:6px;margin-bottom:8px}
.gear{display:flex;align-items:center;gap:10px;background:var(--panel);border-radius:14px;padding:8px 8px 8px 8px}
.gimg{width:38px;height:38px;border-radius:10px;background:var(--tile);overflow:hidden;display:grid;place-items:center;flex:none}
.gimg img{width:100%;height:100%;object-fit:cover}
.gimg svg{width:20px;height:20px;color:var(--ink-3)}
.gt{flex:1;min-width:0;display:flex;flex-direction:column}
.gt b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gt span{font-size:12.5px;color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gv{font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.gear .iconbtn{width:30px;height:30px;background:none}
.gear .iconbtn svg{width:15px;height:15px}
.crew-d .strip{grid-auto-columns:clamp(110px,16vw,140px)}
.selbar .btn[disabled]{opacity:.4}
@media (max-width:860px){
  .crew-h{grid-template-columns:auto minmax(0,1fr) auto auto;gap:10px;padding:12px 14px}
  .crew-h .cw-bar{display:none}
  .crew-h .cw-last{display:none}
  .cw-grid{grid-template-columns:1fr;gap:6px}
  .crew-d{padding:4px 14px 16px}
  .person{grid-template-columns:auto minmax(0,1fr);row-gap:8px}
  .person>.pill,.person>.picker{grid-column:2;justify-self:start}
}
