@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;900&family=Cinzel+Decorative:wght@700&family=JetBrains+Mono:wght@400;700&family=Source+Sans+3:wght@400;600;700&display=swap');

/*
 * ORK Lighti ühine tüpograafiasüsteem.
 *
 * Fontide rollid:
 * - Source Sans 3: tavatekst ja kasutajaliides
 * - Cinzel: põhipealkirjad
 * - JetBrains Mono: numbrid, valemid ja mänguväärtused
 * - Cinzel Decorative: üksikud dekoratiivsed erinimetused
 *
 * Leht läheb süsteemile üle siis, kui ta hakkab seda faili laadima.
 * Seni ei mõjuta need reeglid ühtegi olemasolevat vaadet.
 */

:root{
  --font-body:'Source Sans 3',sans-serif;
  --font-heading:'Cinzel',serif;
  --font-number:'JetBrains Mono',monospace;
  --font-display:'Cinzel Decorative',serif;

  --font-weight-regular:400;
  --font-weight-semibold:600;
  --font-weight-bold:700;
  --font-weight-heavy:900;

  --type-body-size:1rem;
  --type-small-size:.875rem;
  --type-label-size:.75rem;
  --type-micro-size:.6875rem;
  --type-heading-size:1.5rem;
  --type-title-size:2rem;

  --type-body-line-height:1.45;
  --type-compact-line-height:1.2;
  --type-heading-line-height:1.1;
}

/*
 * Tihe profiil A4-lehtedele ja kaartidele.
 * Profiil rakendatakse teadlikult konteinerile, mitte kogu body'le.
 */
.type-profile-dense{
  --type-body-size:12px;
  --type-small-size:10px;
  --type-label-size:9px;
  --type-micro-size:7px;
}

/* Semantilised rollid. Lehespetsiifiline CSS võib muuta ainult suurust. */
.type-body{
  font-family:var(--font-body);
  font-size:var(--type-body-size);
  line-height:var(--type-body-line-height);
}
.type-small{
  font-family:var(--font-body);
  font-size:var(--type-small-size);
  line-height:var(--type-body-line-height);
}
.type-label{
  font-family:var(--font-body);
  font-size:var(--type-label-size);
  line-height:var(--type-compact-line-height);
}
.type-heading{
  font-family:var(--font-heading);
  font-size:var(--type-heading-size);
  font-weight:var(--font-weight-heavy);
  line-height:var(--type-heading-line-height);
}
.type-title{
  font-family:var(--font-heading);
  font-size:var(--type-title-size);
  font-weight:var(--font-weight-heavy);
  line-height:var(--type-heading-line-height);
}
.type-number{
  font-family:var(--font-number);
  font-weight:var(--font-weight-bold);
  font-variant-numeric:tabular-nums;
}
.type-display{
  font-family:var(--font-display);
  font-weight:var(--font-weight-bold);
  line-height:var(--type-heading-line-height);
}