/* Unwritten Craft — "Hearth", the shared design language (see
   docs/DESIGN.md). Warm paper by default, a matching dark palette that
   follows the system, one warm accent (ember) for the one primary
   action, big round tiles and cards, words in chips instead of glyph
   codes. One app, three pages: home — index.html (greeting, Record and
   Upload tiles, the hub last); record — record.html (viewfinder, zoom,
   the shutter dock, cloud, this device's sessions, advanced link);
   upload — upload.html (pick a file, or paste a link).
   html.ios / html.android (set in common.js) only nudge type, radii
   and the top bar; the layout is shared. */
:root{
  --canvas:#FAF6F1; --surface:#FFFFFF; --sunken:#F3ECE4;
  --ink:#2A211C; --ink2:#6F625A; --line:#EADFD3; --ring:#DCCFC2;
  --ember:#D2452A; --ember-press:#B83A20; --ember-ink:#B83A20; --ember-soft:#FCE8E1;
  --sage:#2F7A4B; --sage-soft:#E3F2E7; --honey:#8A5A00; --honey-soft:#FFF3D6;
  --danger:#C23B22; --focus:#D2452A;
  --shadow:0 1px 2px rgba(42,33,28,.06), 0 8px 24px rgba(42,33,28,.06);
  --shadow-lift:0 2px 4px rgba(42,33,28,.08), 0 14px 32px rgba(42,33,28,.10);
  --topbar:rgba(250,246,241,.86);
  --c0:#FCE3D9; --c0i:#B5432A; --c1:#FBEFD2; --c1i:#8A5A00; --c2:#E2EFE1; --c2i:#2F6B3F;
  --c3:#DDEBF4; --c3i:#2B5F80; --c4:#ECE3F3; --c4i:#6A4486; --c5:#F2E3D8; --c5i:#8A4F2E;
  --tap:48px; --r-tile:24px; --r-card:20px; --r-thumb:14px;
  --round:ui-rounded,"SF Pro Rounded","Nunito","Segoe UI Variable Display",system-ui,sans-serif;
  color-scheme:light dark;
}
@media (prefers-color-scheme: dark){
  :root{
    --canvas:#171310; --surface:#221C18; --sunken:#2D2621;
    --ink:#F7EFE6; --ink2:#B9AA9C; --line:#3A312A; --ring:#5A4E44;
    --ember-ink:#FF8A6B; --ember-soft:#3A2420;
    --sage:#7FD39B; --sage-soft:#1F2E24; --honey:#F2C46B; --honey-soft:#33281A;
    --focus:#FF8A6B; --shadow:none; --shadow-lift:none;
    --topbar:rgba(23,19,16,.86);
    --c0:#3A2420; --c0i:#FF9C82; --c1:#33281A; --c1i:#F2C46B; --c2:#1F2E24; --c2i:#7FD39B;
    --c3:#1C2A33; --c3i:#8CC4E6; --c4:#2B2233; --c4i:#C7A6E0; --c5:#33251C; --c5i:#E0A884;
  }
}
html.android{ --r-tile:20px; --r-card:16px; }
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html,body{margin:0;padding:0;background:var(--canvas);color:var(--ink);height:100%;
  font-family:system-ui,-apple-system,"SF Pro Text","Segoe UI",Roboto,sans-serif;
  -webkit-text-size-adjust:100%;}
html.android body{font-family:Roboto,system-ui,"Segoe UI",sans-serif;}
html.android{--round:Roboto,system-ui,sans-serif;}
button,input{font-family:inherit; color:inherit;}
button{cursor:pointer;}
.hidden{display:none !important;}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;}
svg.i{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;flex:none;}
#app{max-width:680px;margin:0 auto;padding:0 18px calc(32px + env(safe-area-inset-bottom));
  min-height:100vh; min-height:100dvh; display:flex; flex-direction:column;}

/* ---- headers: greeting + large title on home, a top bar elsewhere ---- */
.largetitle{padding:calc(26px + env(safe-area-inset-top)) 2px 10px;}
.eyebrow{margin:0 0 2px;color:var(--ink2);font-size:15px;font-weight:600;}
.largetitle h1{font-family:var(--round);font-size:34px;line-height:1.08;margin:0 0 8px;
  font-weight:800;letter-spacing:-.6px;}
html.android .largetitle h1{font-size:32px;font-weight:700;letter-spacing:-.2px;}
.sub{color:var(--ink2);font-size:16px;margin:0;line-height:1.45;}
.topbar{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:1fr auto 1fr;
  align-items:center;min-height:calc(var(--tap) + 8px + env(safe-area-inset-top));
  padding:env(safe-area-inset-top) 8px 0;margin:0 -18px 6px;
  background:var(--topbar);-webkit-backdrop-filter:saturate(1.4) blur(16px);
  backdrop-filter:saturate(1.4) blur(16px);border-bottom:1px solid transparent;}
.topbar h1{font-family:var(--round);font-size:18px;font-weight:700;margin:0;text-align:center;}
.baraction{display:flex;justify-content:flex-end;min-width:var(--tap);}
.backbtn{display:inline-flex;align-items:center;gap:4px;min-height:var(--tap);min-width:var(--tap);
  padding:0 10px 0 6px;background:none;border:none;color:var(--ember-ink);font-size:17px;
  font-weight:600;text-decoration:none;justify-self:start;border-radius:24px;}
.backbtn::before,.chev::before{content:"";display:block;width:10px;height:10px;
  border-left:2.5px solid currentColor;border-bottom:2.5px solid currentColor;
  transform:translateX(3px) rotate(45deg);border-radius:1px;}
.backbtn:active{opacity:.55;}
html.android .topbar{grid-template-columns:auto 1fr auto;}
html.android .topbar h1{text-align:left;font-size:21px;font-weight:500;padding-left:4px;}
html.android .backbtn{color:var(--ink);}
html.android .backbtn .bl{display:none;}
.iconbtn{display:inline-flex;align-items:center;justify-content:center;width:var(--tap);
  height:var(--tap);background:none;border:none;color:var(--ink);border-radius:50%;
  padding:0;text-decoration:none;flex:none;transition:transform .18s ease-out,background .18s;}
.iconbtn:active{background:var(--sunken);transform:scale(.94);}
.iconbtn.tonal{background:var(--sunken);}
.iconbtn.danger{color:var(--danger);}
html.android .iconbtn.danger{color:var(--danger);}

/* ---- status: a friendly note, only while it says something ---- */
#status{color:var(--ink2);font-size:15px;line-height:1.5;padding:4px 4px 10px;}
#status:empty{display:none;}
#status b{color:var(--ink);}

/* ---- action tiles (home): Record filled ember, Upload on surface ---- */
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0 8px;}
.tile{position:relative;display:flex;flex-direction:column;justify-content:flex-start;gap:4px;
  min-height:168px;padding:18px;border-radius:var(--r-tile);text-decoration:none;
  background:var(--surface);color:var(--ink);box-shadow:var(--shadow);
  transition:transform .18s ease-out, box-shadow .18s ease-out;}
.tile:active{transform:scale(.96);}
.tile .tglyph{display:flex;align-items:center;justify-content:center;width:48px;height:48px;
  margin:-2px 0 auto -2px;border-radius:16px;
  background:var(--ember-soft);color:var(--ember-ink);}
.tile .tglyph svg.i{width:26px;height:26px;}
.ttitle{font-family:var(--round);font-size:20px;font-weight:700;letter-spacing:-.2px;margin-top:14px;}
.tsub{font-size:14px;line-height:1.35;color:var(--ink2);}
.tile.primary{background:var(--ember);color:#fff;}
.tile.primary .tsub{color:rgba(255,255,255,.88);}
.tile.primary .tglyph{background:rgba(255,255,255,.2);color:#fff;}
.tile.primary:active{background:var(--ember-press);}
@media (max-width:340px){ .tiles{grid-template-columns:1fr;} .tile{min-height:132px;} }

/* ---- sections ---- */
.library{margin-top:18px;}
.shead{display:flex;align-items:center;gap:8px;margin:6px 2px 10px;}
.shead h2{flex:1;font-family:var(--round);font-size:21px;font-weight:700;margin:0;letter-spacing:-.2px;}
.shead small{display:block;font-family:system-ui,-apple-system,sans-serif;font-size:14px;
  font-weight:400;color:var(--ink2);margin-top:2px;letter-spacing:0;}
html.android .shead h2{font-weight:500;}

/* ---- cards: lessons (hub) and sessions (this device) ---- */
.cards{display:flex;flex-direction:column;gap:10px;}
.cards:empty{display:none;}
.card{background:var(--surface);border-radius:var(--r-card);box-shadow:var(--shadow);}
.lesson,.srow{display:flex;align-items:center;gap:14px;width:100%;min-height:76px;
  padding:10px 8px 10px 10px;border:none;border-radius:var(--r-card);background:var(--surface);
  box-shadow:var(--shadow);color:var(--ink);text-align:left;cursor:pointer;
  transition:transform .18s ease-out;}
.lesson:active,.srow:active{transform:scale(.985);}
.cover,.thumb{position:relative;display:flex;align-items:center;justify-content:center;
  width:56px;height:56px;border-radius:var(--r-thumb);flex:none;overflow:hidden;
  font-family:var(--round);font-size:24px;font-weight:800;}
.thumb{background:#000;}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.thumb .dur{position:absolute;right:4px;bottom:4px;padding:1px 5px;border-radius:6px;
  background:rgba(0,0,0,.62);color:#fff;font:600 11px/1.4 system-ui,sans-serif;
  font-variant-numeric:tabular-nums;}
.cw0{background:var(--c0);color:var(--c0i);} .cw1{background:var(--c1);color:var(--c1i);}
.cw2{background:var(--c2);color:var(--c2i);} .cw3{background:var(--c3);color:var(--c3i);}
.cw4{background:var(--c4);color:var(--c4i);} .cw5{background:var(--c5);color:var(--c5i);}
.ltext{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;}
.ltitle{font-size:17px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lsub{font-size:14px;color:var(--ink2);}
.chips{display:flex;flex-wrap:wrap;gap:6px;}
.chev{display:block;color:var(--ink2);flex:none;padding:0 10px;}
.chev::before{transform:translateX(-3px) rotate(-135deg);width:9px;height:9px;border-width:2px;}
.sright{display:flex;align-items:center;gap:2px;flex:none;}
.empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;
  padding:26px 20px;background:var(--surface);border-radius:var(--r-card);box-shadow:var(--shadow);}
.empty .eglyph{display:flex;align-items:center;justify-content:center;width:56px;height:56px;
  border-radius:50%;background:var(--ember-soft);color:var(--ember-ink);margin-bottom:4px;}
.empty b{font-size:17px;}
.empty span{color:var(--ink2);font-size:14px;line-height:1.45;max-width:30ch;}

/* ---- chips: statuses in words ---- */
.chip{display:inline-flex;align-items:center;gap:4px;min-height:24px;padding:2px 10px;
  border-radius:999px;font-size:13px;font-weight:600;line-height:1.3;white-space:nowrap;
  background:var(--sunken);color:var(--ink2);text-decoration:none;}
.chip.ember{background:var(--ember-soft);color:var(--ember-ink);}
.chip.sage{background:var(--sage-soft);color:var(--sage);}
.chip.honey{background:var(--honey-soft);color:var(--honey);}
.chip.ign{text-transform:capitalize;}
a.chip{min-height:32px;}
.tchip{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;
  background:var(--ember-soft);color:var(--ember-ink);font-size:13px;font-weight:700;
  font-variant-numeric:tabular-nums;flex:none;}
/* upload progress: a ring around the share slot */
.prog{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;
  margin:4px;border-radius:50%;font-size:11px;font-weight:700;color:var(--ember-ink);
  font-variant-numeric:tabular-nums;
  background:radial-gradient(closest-side,var(--surface) 76%,transparent 78% 100%),
    conic-gradient(var(--ember) calc(var(--p,0) * 1%), var(--sunken) 0);}
.spin{display:inline-block;width:22px;height:22px;margin:13px;border-radius:50%;
  border:3px solid var(--honey-soft);border-top-color:var(--honey);animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ---- buttons ---- */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:52px;
  padding:12px 22px;border:none;border-radius:999px;background:var(--sunken);color:var(--ink);
  font-size:17px;font-weight:600;text-decoration:none;transition:transform .18s ease-out;}
.pill:active{transform:scale(.97);}
.pill.primary{background:var(--ember);color:#fff;}
.pill.primary:active{background:var(--ember-press);}
.pill.block{display:flex;width:100%;margin:10px 0 4px;}
/* Debug-only overrides live behind a small link at the page bottom. */
.advlink{background:none;border:none;color:var(--ink2);font-size:14px;min-height:44px;
  padding:8px 6px;text-align:left;text-decoration:underline;text-underline-offset:3px;}
.note{color:var(--ink2);font-size:14px;line-height:1.55;margin:12px 4px 0;}

/* ---- viewfinder ---- */
#stage{position:relative;background:#000;border-radius:var(--r-tile);overflow:hidden;
  margin-top:6px;box-shadow:var(--shadow-lift);}
#view,#player{width:100%;height:300px;object-fit:cover;display:block;background:#000;}
#recbadge{position:absolute;top:14px;left:14px;background:rgba(0,0,0,.55);color:#fff;
  padding:6px 12px 6px 10px;border-radius:999px;font-size:15px;font-weight:700;display:flex;
  gap:8px;align-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
#recdot{width:11px;height:11px;border-radius:50%;background:#FF5A3C;animation:pulse 1.1s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.25;}}
#timer{font-variant-numeric:tabular-nums;}
#playercontrols{position:absolute;left:12px;right:12px;bottom:12px;display:flex;gap:8px;
  justify-content:center;}
#playercontrols button{width:var(--tap);height:var(--tap);background:rgba(0,0,0,.55);color:#fff;
  border:none;border-radius:50%;font-size:17px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);}
#playercontrols button:active{background:rgba(0,0,0,.75);}
.banner{display:flex;gap:10px;align-items:flex-start;font-size:15px;padding:12px 14px;
  line-height:1.45;border-radius:16px;margin-top:10px;}
#micwarn{background:var(--danger);color:#fff;}
#speechwarn{background:var(--honey-soft);color:var(--honey);}
#speechwarn b{color:inherit;}
#zoomrow{display:flex;gap:6px;align-items:center;margin-top:10px;padding:0 6px;
  background:var(--surface);border-radius:999px;box-shadow:var(--shadow);}
#zoomrow button{background:none;color:var(--ink);border:none;border-radius:50%;
  width:var(--tap);height:var(--tap);font-size:24px;line-height:1;padding:0;flex:none;}
#zoomrow button:active{background:var(--sunken);}
#zoomseek{flex:1;accent-color:var(--ember);height:var(--tap);}
#zoomlabel{color:var(--ink2);font-size:14px;font-weight:600;min-width:44px;text-align:center;
  font-variant-numeric:tabular-nums;}

/* ---- the shutter dock: a ring with an ember disc, a rounded square
   while recording. The button keeps its "● Record" / "■ Stop m:ss"
   text for assistive tech and the shared contract; the shape is drawn
   here. The status line lives in the dock, under the shutter. ---- */
.dock{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:12px;
  padding:18px 16px 14px;background:var(--surface);border-radius:var(--r-tile);box-shadow:var(--shadow);}
.dock #status{text-align:center;padding:4px 6px 0;max-width:46ch;}
#recbtn{position:relative;display:block;width:84px;height:84px;border-radius:50%;padding:0;
  border:5px solid var(--ring);background:transparent;color:transparent;font-size:0;
  transition:transform .18s ease-out;}
#recbtn::after{content:"";position:absolute;top:6px;right:6px;bottom:6px;left:6px;border-radius:50%;
  background:var(--ember);transition:all .18s ease-out;}
#recbtn:active{transform:scale(.94);}
#recbtn.stop::after{top:22px;right:22px;bottom:22px;left:22px;border-radius:9px;}
#capcontrols{display:flex;flex-direction:column;gap:8px;width:100%;}
#fallback{color:var(--ink2);font-size:14px;line-height:1.55;text-align:center;}

/* ---- settings rows: the Cloud switch ---- */
.setrow{display:flex;align-items:center;gap:14px;width:100%;min-height:72px;margin-top:12px;
  padding:12px 16px 12px 12px;border:none;border-radius:var(--r-card);background:var(--surface);
  box-shadow:var(--shadow);color:var(--ink);font-size:17px;text-align:left;}
.sglyph{display:flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:14px;background:var(--sunken);color:var(--ink2);flex:none;transition:background .2s,color .2s;}
[aria-checked="true"] .sglyph{background:var(--sage-soft);color:var(--sage);}
.glabel{flex:1;min-width:0;font-weight:600;}
.glabel small{display:block;color:var(--ink2);font-size:14px;font-weight:400;line-height:1.35;margin-top:2px;}
.switch{position:relative;flex:none;width:52px;height:32px;border-radius:16px;
  background:var(--ring);transition:background .2s;}
.switch::after{content:"";position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s;}
[aria-checked="true"] .switch{background:var(--sage);}
[aria-checked="true"] .switch::after{transform:translateX(20px);}
@media (prefers-color-scheme: dark){ [aria-checked="true"] .switch::after{background:#173020;} }
#cloudpanel{background:var(--surface);border-radius:var(--r-card);padding:12px 16px 16px;
  margin-top:10px;box-shadow:var(--shadow);}
#cloudpanel label{display:block;color:var(--ink2);font-size:14px;margin:12px 0 6px;}
input[type=text],input[type=url],input[type=password],input[inputmode]{
  width:100%;min-height:52px;font-size:16px;padding:12px 16px;border:1.5px solid var(--line);
  border-radius:14px;background:var(--canvas);color:var(--ink);}
input::placeholder{color:var(--ink2);opacity:.8;}
input:focus{outline:none;border-color:var(--ember);background:var(--surface);}
#cloudpanel .bnote{color:var(--ink2);font-size:13.5px;line-height:1.5;margin-top:12px;}
#cloudpanel .dbg{margin:4px 0 0;font-size:13.5px;line-height:1.5;}
#cloudpanel .dbg div{display:flex;gap:8px;padding:6px 0;border-top:1px solid var(--line);}
#cloudpanel .dbg dt{color:var(--ink2);flex:0 0 110px;}
#cloudpanel .dbg dd{margin:0;color:var(--ink);word-break:break-all;}

/* ---- hub detail: a lesson, Airbnb-listing style ---- */
#hubstatus{color:var(--ink2);font-size:15px;padding:0 4px 10px;}
#hubstatus:empty{display:none;}
#hubplayer{width:100%;height:300px;object-fit:contain;display:block;background:#000;
  border-radius:var(--r-tile);margin-bottom:8px;}
#hubclose{margin:0 0 12px;}
.detail{background:var(--surface);border-radius:var(--r-tile);overflow:hidden;
  box-shadow:var(--shadow-lift);margin:0 0 16px;}
.banner-cover{position:relative;display:flex;align-items:center;justify-content:center;height:150px;
  font-family:var(--round);font-size:72px;font-weight:800;}
.banner-cover .iconbtn{position:absolute;top:10px;right:10px;background:var(--surface);
  color:var(--ink);box-shadow:var(--shadow);}
.dbody{padding:16px 18px 18px;}
.dtitle{font-family:var(--round);font-size:24px;font-weight:800;line-height:1.2;margin:0;letter-spacing:-.3px;}
.ddate{color:var(--ink2);font-size:15px;margin-top:4px;}
.dacts{display:flex;align-items:center;gap:10px;margin:16px 0 4px;}
.dacts .pill{flex:1;}
.writeup{white-space:pre-wrap;font-size:16px;line-height:1.6;margin-top:16px;padding-top:16px;
  border-top:1px solid var(--line);}
.dsec{font-family:var(--round);font-size:19px;font-weight:700;margin:22px 0 10px;}
.quote{margin:0 0 10px;padding:14px 16px;border-radius:18px;background:var(--canvas);}
.quote blockquote{margin:8px 0 0;font-size:16px;line-height:1.5;}
.quote figcaption{margin-top:6px;color:var(--ink2);font-size:14px;line-height:1.45;}
.chapters{list-style:none;margin:0;padding:0;}
.chapters li{display:flex;align-items:center;gap:12px;min-height:44px;font-size:15px;
  border-bottom:1px solid var(--line);}
.chapters li:last-child{border-bottom:none;}

/* ---- upload page ---- */
.upcard{padding:18px;margin:14px 0 6px;}
.upcard h2{font-family:var(--round);font-size:21px;font-weight:700;margin:0;}
.upcard .note{margin:6px 0 14px;}
.dropzone{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 16px;
  border:2px dashed var(--ring);border-radius:18px;background:var(--canvas);text-align:center;cursor:pointer;
  transition:border-color .18s,background .18s;}
.linkrow{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit;}
.linkrow .eglyph{display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;border-radius:14px;background:var(--ember-soft);color:var(--ember-ink,var(--ember));}
.linkrow .note{margin:0;}
.dropzone:hover,.dropzone:focus-within{border-color:var(--ember);background:var(--ember-soft);}
.dropzone .eglyph{display:flex;align-items:center;justify-content:center;width:56px;height:56px;
  border-radius:50%;background:var(--ember-soft);color:var(--ember-ink);}
.dropzone b{font-size:17px;}
.dropzone span{color:var(--ink2);font-size:14px;word-break:break-all;}
#uploadstatus,#urlstatus{color:var(--ink2);font-size:15px;line-height:1.5;padding:8px 4px 0;}
#fetchhistory{margin-top:14px;}
#uphistory .subhead,#fetchhistory .subhead{font-size:14px;font-weight:600;color:var(--ink2);margin:12px 0 4px;}
#fetchhistory .ltitle.linkurl{font-size:14px;font-weight:400;white-space:normal;overflow-wrap:anywhere;}
#uploadstatus:empty,#urlstatus:empty{display:none;}
#uploadstatus b,#urlstatus b{color:var(--ink);}
#caps{color:var(--ink2);font-size:13px;line-height:1.55;margin:10px 4px 0;}

@media (hover:hover){
  .tile:hover,.lesson:hover,.srow:hover{box-shadow:var(--shadow-lift);}
  .iconbtn:hover{background:var(--sunken);}
  .pill:hover{filter:brightness(.97);}
}
@media (prefers-reduced-motion: reduce){
  #recdot,.spin{animation:none;}
  .tile,.lesson,.srow,.pill,.iconbtn,#recbtn,#recbtn::after,.switch,.switch::after{transition:none;}
  .tile:active,.lesson:active,.srow:active,.pill:active,.iconbtn:active,#recbtn:active{transform:none;}
}
@media (min-width:700px){
  #view,#player,#hubplayer{height:380px;}
  .tile{min-height:190px;}
}
/* Session parts: the capture screens' "Adds a part to ..." note, and
   a tied session's parts list in the hub detail. */
.joinbanner{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px;padding:12px 14px;
  border-radius:18px;background:var(--sage-soft);color:var(--ink);font-size:15px;line-height:1.45;}
.joinbanner .pill{min-height:44px;padding:0 16px;font-size:15px;}
.parts li{gap:10px;}
.parts .tchip{display:inline-flex;align-items:center;gap:4px;border:0;cursor:pointer;font:inherit;}
.parts .tchip .i{width:14px;height:14px;}
.parts .ptitle{flex:1;min-width:0;overflow-wrap:anywhere;}
.parts .pill{min-height:40px;padding:0 14px;font-size:14px;}
.addpart .pill{text-decoration:none;color:inherit;}