/**
 * SEMNELE GAZDEI — mărimea, culoarea, așezarea.
 *
 * Desenele stau în `assets/js/icons.js`; aici stă doar cum se poartă în
 * pagină. Fișierul se coboară pe **tot site-ul**, nu numai pe paginile
 * aplicației: de la 8.19, un emoji scris într-un articol de blog primește
 * același semn ca unul scris într-un buton.
 *
 * DE CE E SCRIS A DOUA OARĂ CE E ȘI ÎN `app.css`
 *
 * Fiindcă `app.css` nu se coboară peste tot — se coboară unde e aplicația,
 * bulina sau bara. Semnele, da. Regulile de bază sunt aceleași, cuvânt cu
 * cuvânt, deci nu se ceartă nicăieri; iar pe o pagină obișnuită, fără
 * aplicație, semnele au totuși mărime și culoare.
 *
 * ---------------------------------------------------------------------
 * FIȘIER SCRIS DE UNEALTĂ. Semnele din `--fclms-mark-*` sunt aceleași
 * desene din `icons.js`, scrise ca adresă de imagine, fiindcă un `::before`
 * nu poate ține un `<svg>`. Dacă se schimbă un desen acolo, se schimbă și
 * aici. Nu se scrie unul fără celălalt: de aceea sunt scrise de aceeași
 * unealtă, dintr-un singur loc.
 * ---------------------------------------------------------------------
 */

/* ====================================================================
 * SEMNUL
 *
 * Mărimea vine din litera de lângă el (`1em`), nu dintr-un număr de
 * puncte: un semn pus într-un titlu crește odată cu titlul, unul dintr-o
 * notă de subsol se face mic odată cu ea. Culoarea vine din scris
 * (`currentColor`): pe un buton plin e albă, pe hârtie neagră se luminează
 * odată cu textul. Amândouă lucrurile pe care un emoji nu le poate face.
 * ==================================================================== */
.fclms-i {
	width: 1em; height: 1em; flex: none;
	display: inline-block; vertical-align: -.125em;
	fill: none; stroke: currentColor;
	stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round;
	/* Fără asta, un semn dintr-un buton primește apăsarea în locul
	   butonului, iar `event.target` ajunge să fie desenul. */
	pointer-events: none;
}

.fclms-i--lg { width: 1.35em; height: 1.35em; }
.fclms-i--xl { width: 2.6em; height: 2.6em; stroke-width: 1.3; }
.fclms-i--sm { width: .85em; height: .85em; }

/* Semnul dintr-un buton stă lipit de vorbă, nu la mijlocul lui. */
.fclms-btn .fclms-i { margin-right: .1em; }
.fclms-btn .fclms-i:only-child { margin-right: 0; }

/* ====================================================================
 * CELE CÂTEVA SEMNE CARE NU IAU CULOAREA SCRISULUI
 *
 * Un semn ia culoarea textului de lângă el — asta e regula, și e bună
 * pentru nouă din zece. Rămân cele la care culoarea **e** înțelesul:
 * bulina verde care spune „e viu”, medalia de aur care nu e medalia de
 * argint. Acolo culoarea se scrie, dar tot dintr-o variabilă a temei,
 * ca să se schimbe odată cu ea.
 *
 * Se scrie `color`, nu `stroke`, fiindcă desenul e pe `currentColor`:
 * o singură proprietate schimbă și linia, și ce e plin înăuntru.
 * ==================================================================== */
.fclms-i--accent { color: var(--fc-accent, var(--fc-primary, currentColor)); }
.fclms-i--bad { color: var(--fc-bad, #dc2626); }
.fclms-i--bronze { color: #b06a34; }
.fclms-i--gold { color: #d4a017; }
.fclms-i--ok { color: var(--fc-good, #16a34a); }
.fclms-i--silver { color: #8e9aa6; }
.fclms-i--warn { color: var(--fc-mid, #d97706); }

/* ====================================================================
 * SEMNELE PUSE DIN FOAIA DE STIL
 *
 * Un `::before` nu poate ține un `<svg>`, ci numai text — de aceea erau
 * emoji acolo unde nu ajunge niciun script. Se pun acum ca mască: cutia
 * se umple cu culoarea scrisului, iar masca decupează desenul din ea.
 *
 * Urmarea e că semnul ia culoarea și mărimea rândului, ca oricare altul,
 * și că `color: transparent` îl face nevăzut fără să-i ia locul din rând —
 * de care se sprijină bifa care se ivește la trecerea cursorului.
 *
 * `-webkit-mask` stă înaintea lui `mask` pentru Safari mai vechi, care
 * știe numai forma cu prefix.
 * ==================================================================== */
:root {
	--fclms-mark-check: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M4.8%2012.6l4.6%204.6L19.2%207.4%22/%3E%3C/svg%3E");
	--fclms-mark-arrow-right: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M4%2012h14.5%22/%3E%3Cpath%20d=%22M13%206.5l6%205.5-6%205.5%22/%3E%3C/svg%3E");
	--fclms-mark-caret-down: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M6.5%209.5L12%2015l5.5-5.5%22/%3E%3C/svg%3E");
	--fclms-mark-party: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M3%2020.8l4.4-11.4%207%207z%22/%3E%3Cpath%20d=%22M7.4%209.4l7%207%22/%3E%3Cpath%20d=%22M12.4%203.2v2.4M16.6%204.4l-1%202M19.8%207.6l-2%201M20.8%2012.4l-2.4-.4%22/%3E%3C/svg%3E");
	--fclms-mark-muscle: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Crect%20x=%223.2%22%20y=%229.2%22%20width=%225.6%22%20height=%2211%22%20rx=%222.6%22/%3E%3Ccircle%20cx=%226%22%20cy=%225.8%22%20r=%222.8%22/%3E%3Cpath%20d=%22M8.8%2011.6c4.2-.2%207.8%201.6%209.6%204.6.9%201.5.2%203.4-1.5%203.9-.9.3-1.8.4-2.7.4H8.8%22/%3E%3Cpath%20d=%22M11.6%2014.8a4.8%204.8%200%200%201%202.6%203.4%22/%3E%3C/svg%3E");
	--fclms-mark-check-circle: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Ccircle%20cx=%2212%22%20cy=%2212%22%20r=%228.4%22/%3E%3Cpath%20d=%22M8%2012.3l2.9%202.9L16.2%209.8%22/%3E%3C/svg%3E");
	--fclms-mark-warning: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M12%204.2L21.2%2019.8H2.8z%22/%3E%3Cpath%20d=%22M12%2010v4.2%22/%3E%3Ccircle%20cx=%2212%22%20cy=%2217.2%22%20r=%22.95%22%20fill=%22currentColor%22%20stroke=%22none%22/%3E%3C/svg%3E");
	--fclms-mark-folders: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M3.2%209.4A1.6%201.6%200%200%201%204.8%207.8h4L10.4%2010h8.8a1.6%201.6%200%200%201%201.6%201.6v6.4a1.6%201.6%200%200%201-1.6%201.6H4.8a1.6%201.6%200%200%201-1.6-1.6z%22/%3E%3Cpath%20d=%22M6%207.8V6.2h11.4v1.6M8%206.2V4.6h9.4v1.6%22/%3E%3C/svg%3E");
	--fclms-mark-minus: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M5%2012h14%22/%3E%3C/svg%3E");
}

/* Cutia unui semn pus din foaia de stil. Se ia cu `@extend` de mână:
   se scriu rândurile astea acolo unde e nevoie, cu `--fclms-mark` pus
   pe desenul dorit. */
.fclms-mark::before,
.fclms-mark::after {
	content: '';
	display: inline-block;
	width: 1em; height: 1em;
	vertical-align: -.125em;
	background-color: currentColor;
	-webkit-mask: var(--fclms-mark) center / contain no-repeat;
	        mask: var(--fclms-mark) center / contain no-repeat;
	/* La tipar, browserul sare peste fundaluri dacă nu i se spune altfel. */
	-webkit-print-color-adjust: exact;
	        print-color-adjust: exact;
}

/* ====================================================================
 * ECRANUL COMPLET
 *
 * Nimic de scris pentru semnele puse ca `<svg>` în pagină: ecranul
 * complet nu mută nimic, doar arată altfel ce e deja acolo, iar ele merg
 * cu cutia lor.
 *
 * Rămân semnele puse din foaia de stil. Ele își iau desenul din
 * `--fclms-mark-*`, scrise pe `:root` — iar `:root` e tot acolo și în
 * ecran complet, fiindcă elementul dus în ecran complet nu iese din
 * pagină. Se scriu totuși și pe `:fullscreen`, pentru browserele care
 * pun elementul într-un strat cu moștenirea ruptă: costă un rând și
 * scutește un „la mine nu se vede semnul, dar numai pe ecran complet”.
 * ==================================================================== */
/* Două rânduri deosebite, nu unul cu virgulă: un selector necunoscut dintr-o
 * listă strică toată regula, iar `::backdrop` e mai nou decât `:fullscreen`.
 * Scrise separat, browserul ia ce știe și lasă ce nu. */
:fullscreen {
	--fclms-mark-check: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M4.8%2012.6l4.6%204.6L19.2%207.4%22/%3E%3C/svg%3E");
	--fclms-mark-arrow-right: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M4%2012h14.5%22/%3E%3Cpath%20d=%22M13%206.5l6%205.5-6%205.5%22/%3E%3C/svg%3E");
	--fclms-mark-caret-down: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M6.5%209.5L12%2015l5.5-5.5%22/%3E%3C/svg%3E");
	--fclms-mark-party: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M3%2020.8l4.4-11.4%207%207z%22/%3E%3Cpath%20d=%22M7.4%209.4l7%207%22/%3E%3Cpath%20d=%22M12.4%203.2v2.4M16.6%204.4l-1%202M19.8%207.6l-2%201M20.8%2012.4l-2.4-.4%22/%3E%3C/svg%3E");
	--fclms-mark-muscle: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Crect%20x=%223.2%22%20y=%229.2%22%20width=%225.6%22%20height=%2211%22%20rx=%222.6%22/%3E%3Ccircle%20cx=%226%22%20cy=%225.8%22%20r=%222.8%22/%3E%3Cpath%20d=%22M8.8%2011.6c4.2-.2%207.8%201.6%209.6%204.6.9%201.5.2%203.4-1.5%203.9-.9.3-1.8.4-2.7.4H8.8%22/%3E%3Cpath%20d=%22M11.6%2014.8a4.8%204.8%200%200%201%202.6%203.4%22/%3E%3C/svg%3E");
	--fclms-mark-check-circle: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Ccircle%20cx=%2212%22%20cy=%2212%22%20r=%228.4%22/%3E%3Cpath%20d=%22M8%2012.3l2.9%202.9L16.2%209.8%22/%3E%3C/svg%3E");
	--fclms-mark-warning: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M12%204.2L21.2%2019.8H2.8z%22/%3E%3Cpath%20d=%22M12%2010v4.2%22/%3E%3Ccircle%20cx=%2212%22%20cy=%2217.2%22%20r=%22.95%22%20fill=%22currentColor%22%20stroke=%22none%22/%3E%3C/svg%3E");
	--fclms-mark-folders: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M3.2%209.4A1.6%201.6%200%200%201%204.8%207.8h4L10.4%2010h8.8a1.6%201.6%200%200%201%201.6%201.6v6.4a1.6%201.6%200%200%201-1.6%201.6H4.8a1.6%201.6%200%200%201-1.6-1.6z%22/%3E%3Cpath%20d=%22M6%207.8V6.2h11.4v1.6M8%206.2V4.6h9.4v1.6%22/%3E%3C/svg%3E");
	--fclms-mark-minus: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M5%2012h14%22/%3E%3C/svg%3E");
}
::backdrop {
	--fclms-mark-check: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M4.8%2012.6l4.6%204.6L19.2%207.4%22/%3E%3C/svg%3E");
	--fclms-mark-arrow-right: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M4%2012h14.5%22/%3E%3Cpath%20d=%22M13%206.5l6%205.5-6%205.5%22/%3E%3C/svg%3E");
	--fclms-mark-caret-down: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M6.5%209.5L12%2015l5.5-5.5%22/%3E%3C/svg%3E");
	--fclms-mark-party: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M3%2020.8l4.4-11.4%207%207z%22/%3E%3Cpath%20d=%22M7.4%209.4l7%207%22/%3E%3Cpath%20d=%22M12.4%203.2v2.4M16.6%204.4l-1%202M19.8%207.6l-2%201M20.8%2012.4l-2.4-.4%22/%3E%3C/svg%3E");
	--fclms-mark-muscle: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Crect%20x=%223.2%22%20y=%229.2%22%20width=%225.6%22%20height=%2211%22%20rx=%222.6%22/%3E%3Ccircle%20cx=%226%22%20cy=%225.8%22%20r=%222.8%22/%3E%3Cpath%20d=%22M8.8%2011.6c4.2-.2%207.8%201.6%209.6%204.6.9%201.5.2%203.4-1.5%203.9-.9.3-1.8.4-2.7.4H8.8%22/%3E%3Cpath%20d=%22M11.6%2014.8a4.8%204.8%200%200%201%202.6%203.4%22/%3E%3C/svg%3E");
	--fclms-mark-check-circle: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Ccircle%20cx=%2212%22%20cy=%2212%22%20r=%228.4%22/%3E%3Cpath%20d=%22M8%2012.3l2.9%202.9L16.2%209.8%22/%3E%3C/svg%3E");
	--fclms-mark-warning: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M12%204.2L21.2%2019.8H2.8z%22/%3E%3Cpath%20d=%22M12%2010v4.2%22/%3E%3Ccircle%20cx=%2212%22%20cy=%2217.2%22%20r=%22.95%22%20fill=%22currentColor%22%20stroke=%22none%22/%3E%3C/svg%3E");
	--fclms-mark-folders: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M3.2%209.4A1.6%201.6%200%200%201%204.8%207.8h4L10.4%2010h8.8a1.6%201.6%200%200%201%201.6%201.6v6.4a1.6%201.6%200%200%201-1.6%201.6H4.8a1.6%201.6%200%200%201-1.6-1.6z%22/%3E%3Cpath%20d=%22M6%207.8V6.2h11.4v1.6M8%206.2V4.6h9.4v1.6%22/%3E%3C/svg%3E");
	--fclms-mark-minus: url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.75%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M5%2012h14%22/%3E%3C/svg%3E");
}


/* ====================================================================
 * CUTIILE ÎN CARE NU SE UMBLĂ
 *
 * Cititorul sare peste `<script>`, `<style>`, câmpurile de scris și
 * cutiile în care omul scrie el însuși. Uneori e nevoie să se sară și
 * peste altceva — o cutie în care emoji-ul **e** conținutul, nu podoaba:
 * un ales de emoji, o listă de coduri, un text arătat ca atare.
 *
 * Se marchează cu clasa de mai jos ori cu `data-fclms-no-icons`, și
 * rămâne cum e scris.
 * ==================================================================== */
.fclms-no-icons { /* semn pentru cititor; nu schimbă nimic la vedere */ }

/* Semnele nu se tipăresc altfel decât se văd: pe hârtie, culoarea
   scrisului e neagră, deci și a lor. Nimic de scris — dar merită spus,
   fiindcă emoji-urile colorate ieșeau la tipar ca niște pete cenușii. */