/* ============================================================
   TUEPAC — App modules (feed · desk · directory · profile ·
   business · advertise · join · about · console). RWB system.
   ============================================================ */

/* ---------- shared breaking bar ---------- */
.breaking{ display:flex; align-items:stretch; border-bottom:1px solid var(--hairline); font-size:var(--fs-small); background:var(--white); }
.breaking__tag{ background:var(--red); color:#fff; font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.16em;
  text-transform:uppercase; padding:9px 16px; display:flex; align-items:center; gap:8px; flex:none; }
.breaking__tag .dot{ width:6px; height:6px; border-radius:50%; background:#fff; animation:blink 1.3s infinite; }
.breaking__body{ padding:9px 18px; display:flex; align-items:center; gap:14px; min-width:0; overflow:hidden; }
.breaking__src{ font-family:var(--sans); font-size:0.72rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--blue); flex:none; }
.breaking__txt{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--ink); }
.breaking__ts{ margin-left:auto; font-family:var(--sans); font-size:0.72rem; font-weight:600; letter-spacing:0.04em; color:var(--ink-45); padding-left:16px; border-left:1px solid var(--hairline); flex:none; }
@media (max-width:680px){ .breaking__ts{ display:none; } }

/* ---------- section head ---------- */
.shead{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:26px; }
.shead h2{ font-size:var(--fs-h2); color:var(--blue); margin-top:14px; }
.morelink{ font-family:var(--sans); font-size:var(--fs-small); font-weight:700; color:var(--blue); border-bottom:1.5px solid var(--mist); padding-bottom:2px; }
.morelink:hover{ border-color:var(--blue); }

/* ---------- two-column app layout ---------- */
.col-2{ display:grid; grid-template-columns:1fr 320px; gap:clamp(28px,4vw,56px); align-items:start; }
.col-2--wide-rail{ grid-template-columns:1fr 360px; }
@media (max-width:940px){ .col-2, .col-2--wide-rail{ grid-template-columns:1fr; } }

/* ---------- feed rows ---------- */
.feed{ display:flex; flex-direction:column; }
.feed-row{ display:grid; grid-template-columns:1fr 190px; gap:22px; padding:24px 0; border-bottom:1px solid var(--hairline); align-items:start; }
.feed-row:first-child{ padding-top:0; }
.feed-row__kicker{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.feed-row__sect{ font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.13em; text-transform:uppercase; color:var(--red); }
.feed-row h3{ font-family:var(--serif); font-size:1.35rem; font-weight:700; color:var(--blue); line-height:1.22; margin-top:9px; letter-spacing:-0.005em; }
.feed-row h3:hover{ color:var(--blue-mid); }
.feed-row__dek{ margin-top:8px; color:var(--ink-60); font-size:var(--fs-small); max-width:62ch; }
.feed-row__meta{ margin-top:12px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; font-size:0.82rem; color:var(--ink-45); }
.feed-row__media{ aspect-ratio:4/3; border-radius:var(--r); overflow:hidden; }
@media (max-width:680px){ .feed-row{ grid-template-columns:1fr; } .feed-row__media{ order:-1; aspect-ratio:16/9; } }

.feed-filters{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:26px; }
.fchip{ font-family:var(--sans); font-size:var(--fs-small); font-weight:600; color:var(--ink); background:var(--white);
  border:1.5px solid var(--mist); border-radius:var(--r-pill); padding:8px 16px; cursor:pointer; transition:.14s; }
.fchip:hover{ border-color:var(--blue); }
.fchip.is-active{ background:var(--blue); color:#fff; border-color:var(--blue); }

/* ---------- rail modules ---------- */
.module{ border:1px solid var(--mist); border-radius:var(--r-lg); overflow:hidden; background:var(--white); margin-bottom:22px; }
.module__head{ padding:13px 18px; border-bottom:1px solid var(--hairline); font-family:var(--sans); font-size:var(--fs-overline);
  font-weight:700; letter-spacing:0.13em; text-transform:uppercase; color:var(--blue); display:flex; align-items:center; justify-content:space-between; }
.module__body{ padding:6px 18px 14px; }
.mini{ display:flex; gap:12px; padding:13px 0; border-bottom:1px solid var(--line-2); }
.mini:last-child{ border-bottom:0; }
.mini__rank{ font-family:var(--serif); font-weight:700; color:var(--red); width:18px; flex:none; }
.mini h4{ font-family:var(--serif); font-size:0.98rem; font-weight:700; color:var(--blue); line-height:1.25; }
.mini .m{ margin-top:5px; font-size:0.76rem; color:var(--ink-45); }

/* indicator list */
.ind{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 0; border-bottom:1px solid var(--line-2); }
.ind:last-child{ border-bottom:0; }
.ind__l{ font-size:0.86rem; color:var(--ink-60); }
.ind__v{ display:flex; align-items:baseline; gap:8px; }
.ind__n{ font-family:var(--serif); font-weight:700; color:var(--blue); font-variant-numeric:tabular-nums; }
.ind__d{ font-family:var(--sans); font-size:0.72rem; font-weight:700; color:var(--green-grade); }
.ind__d.navy{ color:var(--blue-mid); } .ind__d.gold{ color:var(--red); }

/* sponsor strip */
.sponsor-strip{ display:flex; align-items:center; gap:16px; padding:16px 20px; background:var(--off); border:1px solid var(--mist);
  border-left:3px solid var(--red); border-radius:var(--r); flex-wrap:wrap; }
.sponsor-strip .label{ font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.13em; text-transform:uppercase; color:var(--ink-45); }
.sponsor-strip .name{ font-family:var(--serif); font-weight:700; font-size:1.15rem; color:var(--blue); }
.sponsor-strip .tag{ font-size:var(--fs-small); color:var(--ink-60); }
.sponsor-strip .flight{ margin-left:auto; font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.08em; color:var(--ink-45); }

/* ---------- desk nameplate ---------- */
.deskplate{ border-bottom:1px solid var(--hairline); background:var(--white); }
.deskplate__inner{ padding-block:clamp(26px,3.5vw,42px); }
.deskplate__row{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.deskplate__meta{ font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.13em; text-transform:uppercase; color:var(--ink-45); display:flex; gap:16px; flex-wrap:wrap; }
.deskplate h1{ font-size:clamp(2.4rem,4.5vw,3.6rem); color:var(--blue); margin-top:12px; letter-spacing:-0.02em; }
.deskplate__tagline{ margin-top:12px; font-size:var(--fs-body-lg); color:var(--ink-60); max-width:60ch; }
.deskswitch{ display:flex; gap:7px; flex-wrap:wrap; margin-top:24px; }
.deskswitch button{ font-family:var(--sans); font-size:0.84rem; font-weight:600; color:var(--ink); background:var(--white);
  border:1.5px solid var(--mist); border-radius:var(--r-pill); padding:7px 15px; cursor:pointer; transition:.14s; }
.deskswitch button:hover{ border-color:var(--blue); }
.deskswitch button.is-active{ background:var(--blue); color:#fff; border-color:var(--blue); }
.deskswitch .grp{ font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-45); align-self:center; padding-right:4px; }

/* desk stats band */
.statband{ display:grid; grid-template-columns:repeat(6,1fr); border:1px solid var(--mist); border-radius:var(--r-lg); overflow:hidden; }
.statband > div{ padding:18px 20px; border-right:1px solid var(--hairline); }
.statband > div:last-child{ border-right:0; }
.statband .n{ font-family:var(--serif); font-weight:700; font-size:1.7rem; color:var(--blue); line-height:1; }
.statband .l{ font-family:var(--sans); font-size:var(--fs-overline); font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-45); margin-top:8px; }
@media (max-width:900px){ .statband{ grid-template-columns:repeat(3,1fr); } .statband > div:nth-child(3){ border-right:0; } }
@media (max-width:520px){ .statband{ grid-template-columns:repeat(2,1fr); } }

/* desk lead */
.desk-lead{ display:grid; grid-template-columns:1.3fr 1fr; gap:30px; align-items:center; }
.desk-lead__media{ aspect-ratio:4/3; border-radius:var(--r-lg); overflow:hidden; }
.desk-lead h2{ font-size:clamp(1.7rem,2.8vw,2.4rem); color:var(--blue); line-height:1.14; margin-top:14px; }
.desk-lead__dek{ margin-top:16px; color:var(--ink-60); font-size:var(--fs-body-lg); }
.desk-lead__foot{ margin-top:18px; display:flex; align-items:center; gap:14px; flex-wrap:wrap; font-size:var(--fs-small); color:var(--ink-45); }
@media (max-width:760px){ .desk-lead{ grid-template-columns:1fr; } }

/* analysis cards */
.analysis-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.analysis{ border:1px solid var(--mist); border-radius:var(--r-lg); padding:24px; background:var(--white); }
.analysis__by{ font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--red); }
.analysis h4{ font-family:var(--serif); font-size:1.2rem; font-weight:700; color:var(--blue); line-height:1.26; margin-top:12px; }
.analysis__name{ margin-top:16px; font-size:var(--fs-small); color:var(--ink-60); }
@media (max-width:860px){ .analysis-grid{ grid-template-columns:1fr; } }

/* leaderboard / deals table */
.dtable{ width:100%; border:1px solid var(--mist); border-radius:var(--r-lg); overflow:hidden; }
.dtable__row{ display:grid; align-items:center; padding:13px 18px; border-bottom:1px solid var(--line-2); font-size:var(--fs-small); }
.dtable__row:last-child{ border-bottom:0; }
.dtable__row.th{ background:var(--off); font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-45); }
.dtable__row .name{ color:var(--blue); font-weight:600; }
.dtable__row .num{ font-variant-numeric:tabular-nums; color:var(--ink); text-align:right; }
.dtable__row .pos{ font-variant-numeric:tabular-nums; color:var(--green-grade); font-weight:700; text-align:right; }

/* ---------- directory grid ---------- */
.dir-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:900px){ .dir-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .dir-grid{ grid-template-columns:1fr; } }
.pcard{ border:1px solid var(--mist); border-radius:var(--r-lg); padding:24px; background:var(--white); display:flex; flex-direction:column; gap:14px; transition:box-shadow .2s, transform .2s; }
.pcard:hover{ box-shadow:var(--shadow-2); transform:translateY(-2px); }
.pcard__top{ display:flex; align-items:center; gap:13px; }
.pcard__logo{ width:46px; height:46px; border-radius:9px; flex:none; display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:700; font-size:1.15rem; color:#fff; }
.pcard__name{ font-family:var(--serif); font-size:1.18rem; font-weight:700; color:var(--blue); line-height:1.15; }
.pcard__loc{ font-size:0.8rem; color:var(--ink-45); margin-top:3px; }
.pcard__desc{ font-size:var(--fs-small); color:var(--ink-60); flex:1; }
.pcard__focus{ display:flex; gap:6px; flex-wrap:wrap; }
.tagchip{ font-family:var(--sans); font-size:0.7rem; font-weight:600; color:var(--ink-60); background:var(--off); border:1px solid var(--mist); border-radius:var(--r-pill); padding:4px 10px; }
.pcard__foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:14px; border-top:1px solid var(--line-2); font-size:0.78rem; color:var(--ink-45); }
.statusdot{ display:inline-flex; align-items:center; gap:6px; font-weight:700; }
.statusdot i{ width:7px; height:7px; border-radius:50%; }
.statusdot.active i{ background:var(--green-grade); } .statusdot.active{ color:var(--green-grade); }
.statusdot.pilot i{ background:var(--blue-mid); } .statusdot.pilot{ color:var(--blue-mid); }
.statusdot.onboarding i{ background:var(--red); } .statusdot.onboarding{ color:var(--red); }
.statusdot.outreach i,.statusdot.dormant i{ background:var(--mist); } .statusdot.outreach,.statusdot.dormant{ color:var(--ink-45); }

/* logo color variants for publishers */
.lg-red{ background:var(--red); } .lg-navy{ background:var(--blue); } .lg-green{ background:var(--blue-mid); } .lg-gold{ background:var(--blue-deep); }

/* ---------- business cards ---------- */
.biz-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
@media (max-width:760px){ .biz-grid{ grid-template-columns:1fr; } }
.bizcard{ display:flex; gap:16px; border:1px solid var(--mist); border-radius:var(--r-lg); padding:20px; background:var(--white); align-items:flex-start; transition:box-shadow .2s; }
.bizcard:hover{ box-shadow:var(--shadow-2); }
.bizcard__av{ width:52px; height:52px; border-radius:10px; flex:none; display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:700; font-size:1.3rem; color:#fff; background:var(--blue); }
.bizcard h3{ font-family:var(--serif); font-size:1.15rem; font-weight:700; color:var(--blue); }
.bizcard__cat{ font-size:0.8rem; color:var(--ink-45); margin-top:2px; }
.bizcard__desc{ font-size:var(--fs-small); color:var(--ink-60); margin-top:8px; }
.bizcard__tag{ margin-top:10px; }

/* ---------- advertise package cards ---------- */
.pkg-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
@media (max-width:1040px){ .pkg-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .pkg-grid{ grid-template-columns:1fr; } }
.pkg{ border:1px solid var(--mist); border-radius:var(--r-lg); background:var(--white); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow-1); }
.pkg::before{ content:""; display:block; height:4px; background:var(--mist); }
.pkg.accent-navy::before{ background:var(--blue); } .pkg.accent-red::before{ background:var(--red); }
.pkg.accent-green::before{ background:var(--blue-mid); } .pkg.accent-gold::before{ background:var(--blue-deep); }
.pkg__body{ padding:24px; display:flex; flex-direction:column; gap:12px; flex:1; }
.pkg__code{ font-family:var(--mono); font-size:0.72rem; letter-spacing:0.08em; color:var(--ink-45); }
.pkg__name{ font-family:var(--serif); font-size:1.35rem; font-weight:700; color:var(--blue); }
.pkg__price{ font-family:var(--serif); font-size:1.5rem; font-weight:700; color:var(--ink); }
.pkg__impr{ font-family:var(--sans); font-size:0.78rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; color:var(--green-grade); }
.pkg__desc{ font-size:var(--fs-small); color:var(--ink-60); flex:1; }
.pkg__tags{ display:flex; gap:6px; flex-wrap:wrap; }
.pkg__foot{ padding:0 24px 24px; }

/* ---------- profile header ---------- */
.profhero{ background:var(--blue-deep); color:#fff; }
.profhero__inner{ padding-block:clamp(34px,4vw,52px); display:flex; gap:24px; align-items:flex-start; flex-wrap:wrap; }
.profhero__logo{ width:84px; height:84px; border-radius:16px; flex:none; display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-weight:700; font-size:2.2rem; color:#fff; }
.profhero h1{ font-size:clamp(2rem,3.6vw,2.9rem); color:#fff; }
.profhero__meta{ margin-top:10px; color:var(--white-72); font-size:var(--fs-small); display:flex; gap:14px; flex-wrap:wrap; }
.profhero__mission{ margin-top:14px; color:var(--white-72); max-width:58ch; font-size:var(--fs-body); }
.profstats{ display:flex; gap:30px; margin-top:24px; flex-wrap:wrap; }
.profstats .n{ font-family:var(--serif); font-weight:700; font-size:1.6rem; color:#fff; }
.profstats .l{ font-family:var(--sans); font-size:var(--fs-overline); font-weight:600; letter-spacing:0.08em; text-transform:uppercase; color:var(--white-50); margin-top:4px; }

/* ---------- forms (join / account) ---------- */
.formcard{ border:1px solid var(--mist); border-radius:var(--r-lg); background:var(--white); box-shadow:var(--shadow-2); padding:clamp(26px,3vw,40px); }
.formrow{ margin-bottom:20px; }
.formrow label{ display:block; font-family:var(--sans); font-size:var(--fs-small); font-weight:700; color:var(--blue); margin-bottom:7px; }
.formrow input, .formrow select, .formrow textarea{ width:100%; font-family:var(--sans); font-size:var(--fs-body); color:var(--ink);
  background:var(--white); border:1.5px solid var(--mist); border-radius:var(--r); padding:13px 15px; }
.formrow input:focus, .formrow select:focus, .formrow textarea:focus{ outline:none; border-color:var(--blue); }
.steps-rail{ display:flex; flex-direction:column; gap:2px; }
.step-item{ display:flex; gap:16px; padding:16px 0; border-top:1px solid var(--hairline); }
.step-item:last-child{ border-bottom:1px solid var(--hairline); }
.step-item__n{ width:30px; height:30px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center;
  font-family:var(--sans); font-weight:700; font-size:0.85rem; background:var(--off); color:var(--blue); border:1.5px solid var(--mist); }
.step-item.done .step-item__n{ background:var(--blue); color:#fff; border-color:var(--blue); }
.step-item.active .step-item__n{ background:var(--red); color:#fff; border-color:var(--red); }
.step-item b{ color:var(--blue); }
.step-item span{ display:block; color:var(--ink-60); font-size:var(--fs-small); margin-top:2px; }

/* ============================================================
   ADMIN CONSOLE
   ============================================================ */
.console{ display:grid; grid-template-columns:248px 1fr; min-height:100vh; background:var(--off); }
.cside{ background:var(--blue-deep); color:#fff; position:sticky; top:0; height:100vh; display:flex; flex-direction:column; padding:20px 16px; overflow-y:auto; }
.cside__brand{ display:flex; align-items:center; gap:11px; padding:0 6px 18px; border-bottom:1px solid var(--white-16); margin-bottom:14px; }
.cside__mark{ width:32px; height:32px; border-radius:7px; flex:none; background:var(--blue) var(--keystone) center / 22px no-repeat; }
.cside__name{ font-family:var(--serif); font-weight:700; font-size:1.1rem; color:#fff; }
.cside__name span{ display:block; font-family:var(--sans); font-size:0.56rem; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--white-50); margin-top:2px; }
.cside__grp{ font-family:var(--sans); font-size:0.6rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--white-50); margin:16px 8px 7px; }
.cnav{ display:flex; flex-direction:column; gap:1px; }
.cnav button{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 12px; background:transparent; border:0;
  border-left:2px solid transparent; color:var(--white-72); text-align:left; cursor:pointer; font-family:var(--sans); font-size:0.86rem; font-weight:500; border-radius:0 var(--r) var(--r) 0; }
.cnav button:hover{ background:var(--white-08); color:#fff; }
.cnav button.is-active{ background:var(--white-08); color:#fff; border-left-color:var(--red); font-weight:700; }
.cnav button .b{ font-family:var(--sans); font-size:0.66rem; font-weight:700; background:var(--red); color:#fff; border-radius:var(--r-pill); padding:1px 7px; }
.cside__foot{ margin-top:auto; padding-top:14px; border-top:1px solid var(--white-16); font-size:0.72rem; color:var(--white-50); line-height:1.6; }
.cside__foot a{ color:#9BC4FF; }

.cmain{ min-width:0; display:flex; flex-direction:column; }
.ctop{ background:var(--white); border-bottom:1px solid var(--hairline); padding:16px clamp(20px,3vw,36px); display:flex; align-items:center; justify-content:space-between; gap:16px; position:sticky; top:0; z-index:10; }
.ctop__title{ font-family:var(--serif); font-size:1.4rem; font-weight:700; color:var(--blue); }
.ctop__crumb{ font-family:var(--sans); font-size:0.72rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-45); }
.ctop__actions{ display:flex; align-items:center; gap:10px; }
.cbody{ padding:clamp(20px,3vw,32px); }
.cview{ display:none; } .cview.is-active{ display:block; }

/* kpi cards */
.kpi-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
@media (max-width:980px){ .kpi-grid{ grid-template-columns:1fr 1fr; } }
.kpi{ background:var(--white); border:1px solid var(--mist); border-radius:var(--r-lg); padding:22px; }
.kpi__l{ font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-45); }
.kpi__n{ font-family:var(--serif); font-weight:700; font-size:2.1rem; color:var(--blue); margin-top:10px; line-height:1; }
.kpi__d{ font-family:var(--sans); font-size:0.78rem; font-weight:700; color:var(--green-grade); margin-top:8px; }

.panel{ background:var(--white); border:1px solid var(--mist); border-radius:var(--r-lg); overflow:hidden; margin-top:22px; }
.panel__head{ padding:16px 20px; border-bottom:1px solid var(--hairline); display:flex; align-items:center; justify-content:space-between; gap:14px; }
.panel__head h3{ font-family:var(--serif); font-size:1.2rem; font-weight:700; color:var(--blue); }
.panel__body{ padding:6px 20px 16px; }

/* queue rows */
.qrow{ display:grid; grid-template-columns:1fr auto; gap:14px; padding:16px 0; border-bottom:1px solid var(--line-2); align-items:center; }
.qrow:last-child{ border-bottom:0; }
.qrow__main{ min-width:0; }
.qrow__hed{ font-family:var(--serif); font-size:1.05rem; font-weight:700; color:var(--blue); line-height:1.25; }
.qrow__meta{ margin-top:6px; font-size:0.78rem; color:var(--ink-45); display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.qrow__actions{ display:flex; gap:8px; align-items:center; }

/* admin table */
.atable{ width:100%; border-collapse:collapse; font-size:var(--fs-small); }
.atable th{ text-align:left; font-family:var(--sans); font-size:var(--fs-overline); font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-45); padding:11px 14px; border-bottom:1px solid var(--mist); }
.atable td{ padding:13px 14px; border-bottom:1px solid var(--line-2); color:var(--ink); }
.atable tr:last-child td{ border-bottom:0; }
.atable td.name{ color:var(--blue); font-weight:600; }
.atable .bar{ height:6px; border-radius:3px; background:var(--off); overflow:hidden; min-width:80px; }
.atable .bar i{ display:block; height:100%; background:var(--blue); }

.pill{ font-family:var(--sans); font-size:0.66rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; padding:3px 9px; border-radius:var(--r-pill); white-space:nowrap; }
.pill.green{ background:rgba(31,122,77,0.1); color:var(--green-grade); }
.pill.blue{ background:rgba(10,49,97,0.08); color:var(--blue); }
.pill.red{ background:rgba(179,25,66,0.1); color:var(--red); }
.pill.gray{ background:var(--off); color:var(--ink-45); }