/* ============================================================
   SWISS CLUSTER MACHINE NAMES — component styles
   Framework-free. Vertical machine-name label.

   Class:  .sc-machine-name

   The text is rotated 90 degrees and reads bottom-to-top.
   Inter, 80px, weight 900, secondary grey.

   Usage:  <span class="sc-machine-name">SC-1</span>

   Theming: override the CSS variables in :root or on the element.
   ============================================================ */

.sc-machine-name {
  /* ---- design tokens (override to re-theme) ---- */
  --sc-mn-color: var(--sc-gray-3); /* secondary grey   */
  --sc-mn-size: 80px;
  --sc-mn-weight: var(--sc-weight-black);
  --sc-mn-font: var(--sc-font-sans);

  /* ---- type ---- */
  display: inline-block;
  margin: 0;
  font-family: var(--sc-mn-font);
  font-size: var(--sc-mn-size);
  font-weight: var(--sc-mn-weight);
  line-height: 1;
  color: var(--sc-mn-color);
  white-space: nowrap;
  -webkit-font-smoothing: antialiased;

  /* ---- rotation: 90deg, reading bottom-to-top ---- */
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}