/* ekplabz GLOSSARY — deep blue sheets with pink neon. Term pages are datasheets (single-glossary.php), the index is
   archive-glossary.php. --g is the primary genre colour of a term; the pink (--pk) is the glossary's own. */
.ekp-glpage {
  --pk: #ff2bd6;
  --navy: #071233;
  --navy-2: #0d1d4f;
  --line: rgba(120, 160, 255, .22);
  --txt: #dfe7ff;
  --dim: #8fa0cf;
  padding: 28px 0 60px;
  background:
    linear-gradient(rgba(255, 43, 214, .05) 1px, transparent 1px) 0 0 / 32px 32px,
    linear-gradient(90deg, rgba(255, 43, 214, .05) 1px, transparent 1px) 0 0 / 32px 32px,
    radial-gradient(ellipse at 50% 0%, #10245e 0%, #050c26 70%);
  color: var(--txt);
}
.gl-sheet { --g: var(--pk); --acc: var(--g); /* the COPY key glows in the primary genre colour */ max-width: 1080px; margin: 0 auto; padding: 0 20px; position: relative; }
.gl-sheet.-index { max-width: 1200px; }
.ekp-glpage a { color: inherit; }
.gl-no { font-family: var(--mono); font-size: 11px; letter-spacing: .16em; color: var(--dim); }
.gl-no b { color: var(--pk); text-shadow: 0 0 8px var(--pk); font-weight: 700; }

/* ── trail (back to the index) ── */
.gl-trail { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; font-family: var(--mono); font-size: 12px; letter-spacing: .1em; color: var(--dim); }
.gl-trail i { font-style: normal; opacity: .6; }
.gl-trail b { color: var(--txt); font-weight: 500; }
.gl-back {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 16px 8px 12px; font-weight: 700; color: #fff !important;
  background: rgba(255, 43, 214, .14); box-shadow: inset 0 0 0 1px var(--pk), 0 0 14px rgba(255, 43, 214, .35);
  clip-path: polygon(10px 0, 100% 0, 100% 100%, 0 100%, 0 10px);
}
.gl-back span { font-size: 18px; line-height: 1; color: var(--pk); }
.gl-back:hover { background: rgba(255, 43, 214, .3); }

/* ── head plate ── */
.gl-head {
  position: relative; display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; padding: 26px 28px;
  background: linear-gradient(135deg, var(--navy-2), var(--navy));
  box-shadow: inset 0 0 0 1px var(--line), inset 4px 0 0 var(--g);
  clip-path: polygon(0 0, calc(100% - 26px) 0, 100% 26px, 100% 100%, 26px 100%, 0 calc(100% - 26px));
}
.gl-head::after { /* corner hazard */
  content: ""; position: absolute; right: 0; top: 0; width: 120px; height: 8px;
  background: repeating-linear-gradient(-45deg, var(--pk) 0 7px, transparent 7px 14px); opacity: .7;
}
.gl-letter { /* index row: a quiet stamp, not the headline */
  width: 56px; height: 56px; display: grid; place-items: center; align-self: start; margin-top: 6px;
  font-family: var(--tech); font-weight: 600; font-size: 26px; line-height: 1; color: var(--dim);
  box-shadow: inset 0 0 0 1px rgba(255, 43, 214, .4);
  clip-path: polygon(9px 0, 100% 0, 100% calc(100% - 9px), calc(100% - 9px) 100%, 0 100%, 0 9px);
}
.gl-name h1 { margin: 4px 0 6px; font-size: clamp(30px, 4.6vw, 48px); line-height: 1.15; font-weight: 700; color: #fff; letter-spacing: .02em; }
.gl-read { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; font-size: 14px; color: var(--txt); }
.gl-read small, .gl-alias small { font-family: var(--mono); font-size: 10px; letter-spacing: .14em; color: var(--pk); margin-right: 8px; }
.gl-alias { margin: 6px 0 0; font-size: 13px; color: var(--dim); }
.gl-genres { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.gl-genre {
  font-size: 12px; padding: 4px 10px; color: var(--txt); text-decoration: none;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 60%, transparent); background: color-mix(in srgb, var(--c) 10%, transparent);
}
.gl-genre.-main { color: #fff; box-shadow: inset 0 0 0 1px var(--c), 0 0 10px color-mix(in srgb, var(--c) 50%, transparent); background: color-mix(in srgb, var(--c) 24%, transparent); }
.gl-upd { margin-top: 6px; font-family: var(--mono); font-size: 10px; letter-spacing: .14em; color: var(--dim); }

/* ── definition ── */
.gl-def {
  position: relative; margin: 18px 0 0; padding: 18px 24px 18px 28px;
  background: rgba(255, 43, 214, .07); box-shadow: inset 0 0 0 1px rgba(255, 43, 214, .45), 0 0 26px rgba(255, 43, 214, .12);
}
.gl-def small { font-family: var(--mono); font-size: 10px; letter-spacing: .2em; color: var(--pk); text-shadow: 0 0 6px var(--pk); }
.gl-def p { margin: 6px 0 0; font-size: 18px; line-height: 1.75; font-weight: 500; color: #fff; }

/* ── body text ──
   The body is SWELL's .post_content, so its heading / table / TOC styles apply too. Every rule here is scoped to
   .ekp-glpage .gl-body (stronger than SWELL's .post_content rules) and SWELL's heading decorations are switched off. */
.gl-body {
  margin-top: 18px; padding: 30px clamp(18px, 4vw, 44px) 34px; color: #1a2240; counter-reset: gsec;
  background: linear-gradient(#f7f9ff, #edf1fb); box-shadow: inset 0 0 0 1px rgba(30, 60, 140, .25);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0 100%);
  font-size: 16px; line-height: 1.95;
}
.ekp-glpage .gl-body > :first-child { margin-top: 0; }
.ekp-glpage .gl-body > * { margin-bottom: 1.1em; }
.ekp-glpage .gl-body :is(h2, h3, h4)::before, .ekp-glpage .gl-body :is(h2, h3, h4)::after { content: none; }

/* H2: navy plate, pink section number */
.ekp-glpage .gl-body h2 {
  position: relative; margin: 2.2em 0 .9em; padding: 10px 16px 10px 62px; border: 0; border-radius: 0;
  font-size: 20px; line-height: 1.45; color: #fff; counter-increment: gsec;
  background: linear-gradient(90deg, var(--navy-2), #1b3780); box-shadow: inset 4px 0 0 var(--pk), inset 0 -2px 0 rgba(255, 43, 214, .55);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
}
.ekp-glpage .gl-body h2::before {
  content: counter(gsec, decimal-leading-zero); position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: auto; height: auto;
  padding: 1px 6px; font-family: var(--mono); font-size: 12px; font-weight: 700; color: var(--pk);
  border: 1px solid var(--pk); background: rgba(0, 0, 0, .3); text-shadow: 0 0 6px var(--pk);
}
/* H3: pink rail, dashed rule */
.ekp-glpage .gl-body h3 {
  margin: 1.8em 0 .7em; padding: 2px 0 6px 12px; font-size: 17.5px; line-height: 1.5; color: var(--navy-2); background: none;
  border: 0; border-left: 4px solid var(--pk); border-bottom: 1px dashed #b9c4e2;
}
.ekp-glpage .gl-body h4 { margin: 1.5em 0 .5em; font-size: 16px; color: var(--navy-2); }

.ekp-glpage .gl-body :is(ul, ol) { padding-left: 1.4em; }
.ekp-glpage .gl-body li { margin: .25em 0; }
.ekp-glpage .gl-body li::marker { color: var(--pk); }
.ekp-glpage .gl-body strong { background: linear-gradient(transparent 62%, rgba(255, 43, 214, .22) 62%); }
.ekp-glpage .gl-body a:not(.ekp-gl) { color: #1d3d9c; text-decoration: underline; }
.ekp-glpage .gl-body :not(pre) > code { font-family: var(--mono); font-size: .88em; padding: 1px 5px; background: #e1e7f6; color: #0d1d4f; border: 0; }
.ekp-glpage .gl-body hr, .ekp-glpage .gl-body hr.wp-block-separator { width: 100%; max-width: none; margin: 2em 0; border: 0; height: 2px; opacity: 1; background: repeating-linear-gradient(90deg, rgba(255, 43, 214, .5) 0 10px, transparent 10px 16px); }

/* table: a component spec sheet — navy head row with a pink rule, quiet zebra rows */
.ekp-glpage .gl-body .wp-block-table { margin: 0 0 1.5em; overflow-x: auto; }
.ekp-glpage .gl-body table { width: 100%; border: 0; border-collapse: collapse; font-size: 14.5px; line-height: 1.65; }
.ekp-glpage .gl-body :is(th, td) { padding: 9px 12px; text-align: left; vertical-align: top; border: 1px solid #cfd7ee; word-break: normal; overflow-wrap: anywhere; }
.ekp-glpage .gl-body :is(th, thead td) {
  font-family: var(--body); font-weight: 700; font-size: 13px; letter-spacing: .04em; color: #fff;
  background: linear-gradient(180deg, #1b3780, var(--navy-2)); border-color: #0a1640; border-bottom: 2px solid var(--pk);
}
.ekp-glpage .gl-body tbody tr:nth-child(even) td { background: rgba(30, 60, 140, .045); }
.ekp-glpage .gl-body tbody td:first-child { font-weight: 700; color: var(--navy-2); }
.ekp-glpage .gl-body tbody tr:hover td { background: rgba(255, 43, 214, .06); }

/* SWELL's table of contents inside the body */
.ekp-glpage .gl-body .p-toc { margin: 0 0 1.6em; padding: 14px 18px; border: 0; background: #fff; box-shadow: inset 0 0 0 1px #cfd7ee, inset 4px 0 0 var(--pk); }
.ekp-glpage .gl-body .p-toc::before, .ekp-glpage .gl-body .p-toc::after { content: none; }
.ekp-glpage .gl-body .p-toc__ttl { margin: 0 0 6px; padding: 0; font-family: var(--mono); font-size: 11px; letter-spacing: .2em; color: var(--pk); text-align: left; }
.ekp-glpage .gl-body .p-toc__ttl::before { content: none; }
.ekp-glpage .gl-body .p-toc__list { margin: 0; padding-left: 1.3em; font-size: 14px; }
.ekp-glpage .gl-body .p-toc__list li { margin: .15em 0; }
.ekp-glpage .gl-body .p-toc__link { color: var(--navy-2); text-decoration: none; }
.ekp-glpage .gl-body .p-toc__link:hover { color: #c4129f; }

/* ── sections under the body ── */
.gl-sec { margin-top: 26px; }
.gl-sec-h { display: flex; align-items: baseline; gap: 12px; margin: 0 0 10px; font-family: var(--tech); font-size: 20px; letter-spacing: .14em; color: #fff; }
.gl-sec-h span { font-family: var(--body); font-size: 12px; letter-spacing: .04em; color: var(--dim); font-weight: 400; }
.gl-rel { display: flex; flex-wrap: wrap; gap: 8px; }
.gl-rel a, .gl-rel span { font-size: 14px; padding: 6px 12px; }
.gl-rel a { --c: var(--pk); color: #fff; text-decoration: none; box-shadow: inset 0 0 0 1px var(--c); background: color-mix(in srgb, var(--c) 14%, transparent); }
.gl-rel a:hover { box-shadow: inset 0 0 0 1px var(--c), 0 0 12px var(--c); }
.gl-rel span { color: var(--dim); outline: 1px dashed rgba(143, 160, 207, .45); outline-offset: -1px; }
.gl-uses { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.gl-uses a { display: flex; gap: 14px; padding: 9px 14px; font-size: 14.5px; text-decoration: none; background: rgba(255, 255, 255, .05); box-shadow: inset 2px 0 0 var(--g); }
.gl-uses a:hover { background: rgba(255, 255, 255, .1); }
.gl-uses time { font-family: var(--mono); font-size: 11.5px; color: var(--dim); flex: none; padding-top: 2px; }
.ekp-glpage .ekp-links { margin-top: 30px; }
.gl-arts { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 10px; }
.gl-art {
  display: flex; flex-direction: column; text-decoration: none; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--line), inset 0 3px 0 var(--c);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%); transition: box-shadow .2s, transform .2s;
}
.gl-art:hover { transform: translateY(-2px); box-shadow: inset 0 0 0 1px var(--c), inset 0 3px 0 var(--c), 0 0 16px color-mix(in srgb, var(--c) 40%, transparent); }
.ga-img { aspect-ratio: 16 / 9; background: #0b1636; overflow: hidden; }
.ga-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ga-bd { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px 13px; }
.ga-m { display: flex; justify-content: space-between; gap: 8px; font-family: var(--mono); font-size: 10px; letter-spacing: .06em; color: var(--dim); }
.ga-m b { color: var(--c); font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ga-t { font-size: 14px; line-height: 1.55; color: #fff; }
.gl-more { display: inline-block; margin-top: 12px; padding: 8px 16px; font-family: var(--mono); font-size: 12px; letter-spacing: .1em; text-decoration: none; color: #fff; box-shadow: inset 0 0 0 1px var(--pk); }
.gl-more:hover { background: rgba(255, 43, 214, .2); }
.gl-latest { margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--line); }

/* ── previous / next ── */
.gl-pn { display: grid; grid-template-columns: 1fr auto 1fr; gap: 10px; margin-top: 34px; }
.gl-pn a { display: flex; flex-direction: column; gap: 2px; padding: 12px 16px; text-decoration: none; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--line); font-size: 15px; }
.gl-pn a:hover { box-shadow: inset 0 0 0 1px var(--pk), 0 0 12px rgba(255, 43, 214, .35); }
.gl-pn small { font-family: var(--mono); font-size: 10px; letter-spacing: .16em; color: var(--pk); }
.gl-pn .-next { text-align: right; }
.gl-pn .-index { justify-content: center; font-family: var(--mono); font-size: 12px; letter-spacing: .2em; color: var(--pk); }

/* ───────── index page ───────── */
.gl-hero {
  display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 10px;
  background: linear-gradient(135deg, var(--navy-2), var(--navy)); box-shadow: inset 0 0 0 1px var(--line), 0 0 40px rgba(255, 43, 214, .12);
  clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 30px, 100% 100%, 30px 100%, 0 calc(100% - 30px));
}
.gl-hero-img { /* light blueprint window: the machine images have a white ground */
  align-self: stretch; display: grid; place-items: center; padding: 14px;
  background:
    linear-gradient(rgba(30, 60, 140, .07) 1px, transparent 1px) 0 0 / 22px 22px,
    linear-gradient(90deg, rgba(30, 60, 140, .07) 1px, transparent 1px) 0 0 / 22px 22px,
    #f4f6fb;
  box-shadow: inset 0 0 0 2px var(--pk), inset 0 0 40px rgba(255, 43, 214, .25);
}
.gl-hero-img img { width: 100%; max-width: 620px; height: auto; mix-blend-mode: multiply; }
.gl-hero-txt { padding: 30px 34px; }
.gl-hero h1 { margin: 8px 0 10px; font-family: var(--tech); font-size: clamp(44px, 6vw, 76px); line-height: .95; letter-spacing: .08em; color: #fff; text-shadow: 0 0 14px var(--pk), 0 0 40px rgba(255, 43, 214, .6), 3px 0 0 rgba(255, 43, 214, .6); }
.gl-hero h1 span { display: block; margin-top: 8px; font-family: var(--body); font-size: 20px; letter-spacing: .3em; text-shadow: none; color: var(--pk); }
.gl-hero p { margin: 0; font-size: 14.5px; line-height: 1.8; color: var(--txt); }
.gl-spec { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 20px 0 0; }
.gl-spec div { padding: 10px 12px; background: rgba(255, 255, 255, .05); box-shadow: inset 0 0 0 1px var(--line), inset 0 3px 0 var(--pk); }
.gl-spec dt { font-family: var(--mono); font-size: 10px; letter-spacing: .16em; color: var(--dim); }
.gl-spec dd { margin: 2px 0 0; font-family: var(--tech); font-weight: 700; font-size: 32px; line-height: 1; color: #fff; text-shadow: 0 0 10px rgba(255, 43, 214, .7); }
.gl-spec dd small { font-size: 16px; color: var(--dim); text-shadow: none; }
.gl-spec dd.-date { font-family: var(--mono); font-size: 14px; padding-top: 10px; }

.gl-meters { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px 14px; margin: 22px 0 0; }
.gl-meter { display: grid; grid-template-columns: 7.5em 1fr auto; align-items: center; gap: 10px; padding: 6px 10px; border: 0; cursor: pointer; text-align: left; font: inherit; color: var(--txt); background: rgba(255, 255, 255, .04); box-shadow: inset 0 0 0 1px var(--line); }
.gl-meter:disabled { cursor: default; opacity: .4; }
.gl-meter:not(:disabled):hover, .gl-meter.-on { box-shadow: inset 0 0 0 1px var(--c), 0 0 12px color-mix(in srgb, var(--c) 45%, transparent); }
.gl-meter.-on { background: color-mix(in srgb, var(--c) 16%, transparent); }
.gm-n { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gm-bar { height: 6px; background: rgba(255, 255, 255, .08); }
.gm-bar i { display: block; height: 100%; width: var(--w); background: var(--c); box-shadow: 0 0 8px var(--c); }
.gm-c { font-family: var(--mono); font-size: 12px; }
.gm-c small { margin-left: 6px; font-size: 10px; color: var(--dim); }

.gl-tools { position: sticky; top: 0; z-index: 10; display: grid; grid-template-columns: 1fr auto; gap: 10px 14px; align-items: center; margin: 22px -20px 0; padding: 12px 20px; background: rgba(5, 12, 38, .92); backdrop-filter: blur(6px); box-shadow: 0 1px 0 var(--line); }
.gl-search { display: flex; align-items: center; gap: 0; box-shadow: inset 0 0 0 1px var(--pk), 0 0 14px rgba(255, 43, 214, .25); }
.gl-search span { padding: 0 12px; font-family: var(--mono); font-size: 11px; letter-spacing: .16em; color: var(--pk); }
.gl-search input { flex: 1; min-width: 0; padding: 11px 12px; border: 0; outline: 0; font: inherit; font-size: 15px; color: #fff; background: rgba(255, 255, 255, .06); }
.gl-search input::placeholder { color: var(--dim); }
.gl-hit { font-family: var(--mono); font-size: 12px; letter-spacing: .12em; color: var(--dim); }
.gl-tabs { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; }
.gl-tabs a { min-width: 30px; padding: 4px 6px; text-align: center; font-family: var(--mono); font-size: 13px; text-decoration: none; color: #fff; background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px var(--line); }
.gl-tabs a:hover { box-shadow: inset 0 0 0 1px var(--pk), 0 0 10px rgba(255, 43, 214, .45); }
.gl-tabs a.-off { opacity: .25; pointer-events: none; }
.gl-tabs a.-gap { margin-left: 12px; }
/* one genre at a time: radio buttons drawn as chips */
.gl-pick { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; }
.gl-pick label { cursor: pointer; }
.gl-pick input { position: absolute; opacity: 0; pointer-events: none; }
.gl-pick span { display: block; padding: 4px 10px; font-size: 12.5px; white-space: nowrap; color: var(--dim); box-shadow: inset 3px 0 0 var(--c), inset 0 0 0 1px var(--line); }
.gl-pick label:hover span { color: #fff; box-shadow: inset 3px 0 0 var(--c), inset 0 0 0 1px var(--c); }
.gl-pick input:checked + span { color: #fff; background: color-mix(in srgb, var(--c) 22%, transparent); box-shadow: inset 3px 0 0 var(--c), inset 0 0 0 1px var(--c), 0 0 12px color-mix(in srgb, var(--c) 45%, transparent); }
.gl-pick input:focus-visible + span { outline: 2px solid var(--c); outline-offset: 1px; }

.gl-row { margin-top: 30px; scroll-margin-top: var(--gl-stick, 150px); }
.gl-row[hidden], .gl-card[hidden] { display: none; }
.gl-row-h { display: flex; align-items: baseline; gap: 14px; margin: 0 0 12px; padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.gl-row-h b { font-family: var(--tech); font-size: 34px; line-height: 1; color: #fff; text-shadow: 0 0 12px var(--pk); }
.gl-row-h span { font-family: var(--mono); font-size: 11px; letter-spacing: .14em; color: var(--dim); font-weight: 400; }
.gl-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.gl-card {
  display: flex; flex-direction: column; gap: 4px; padding: 13px 15px 14px 17px; text-decoration: none;
  background: linear-gradient(135deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02));
  box-shadow: inset 0 0 0 1px var(--line), inset 3px 0 0 var(--c);
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 0 100%);
  transition: box-shadow .2s, transform .2s;
}
.gl-card:hover { transform: translateY(-2px); box-shadow: inset 0 0 0 1px var(--pk), inset 3px 0 0 var(--c), 0 0 18px rgba(255, 43, 214, .3); }
.gc-no { font-family: var(--mono); font-size: 10px; letter-spacing: .14em; color: var(--pk); }
.gc-t { font-size: 18px; color: #fff; line-height: 1.35; }
.gc-r { font-size: 12px; color: var(--dim); }
.gc-d { font-size: 13px; line-height: 1.65; color: var(--txt); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.gc-g { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
.gc-g i { font-style: normal; font-size: 10.5px; padding: 1px 7px; color: var(--txt); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 60%, transparent); }
.gl-empty, .gl-none { margin: 30px 0; text-align: center; color: var(--dim); }

@media (max-width: 760px) {
  .gl-head { grid-template-columns: auto 1fr; padding: 20px; }
  .gl-letter { width: 42px; height: 42px; font-size: 20px; }
  .gl-genres { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; align-items: center; }
  .gl-hero { grid-template-columns: 1fr; }
  .gl-hero-txt { padding: 22px 20px 26px; }
  .gl-spec { grid-template-columns: repeat(2, 1fr); }
  .gl-pn { grid-template-columns: 1fr 1fr; }
  .gl-pn .-index { grid-column: 1 / -1; order: 3; }
  .gl-tools { grid-template-columns: 1fr; }
}

/* phones: the genre chips and the index buttons each in one row that scrolls sideways, so the sticky bar stays short */
@media (max-width: 599px) {
  .gl-tabs, .gl-pick { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 2px; }
  .gl-tabs::-webkit-scrollbar, .gl-pick::-webkit-scrollbar { display: none; }
  .gl-tabs a, .gl-pick label { flex: none; }
}
