/* ============================================================
SCENT WARDROBE — Webfonts (@font-face only)
Kept in its OWN stylesheet so it can be loaded at the DOCUMENT
level (page ), separate from the component styles which
are injected into the app's shadow root.
Why document-level:
- @font-face registered on the document is visible to
document.fonts.load() (the boot() FOUT-preload in app.js) and
still pierces the shadow boundary to style shadow content.
- The relative url("fonts/…") paths resolve against THIS
stylesheet's URL (…/dist/scent-wardrobe-fonts.css → …/dist/fonts/),
which only holds when it's loaded as a real , not inlined.
(Nunito + Playfair Display come from the Google Fonts .)
============================================================ */
@font-face { font-family:"Basier Square"; src:url("fonts/basiersquare-regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Basier Square"; src:url("fonts/basiersquare-medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"Cochin"; src:url("fonts/cochin.woff2") format("woff2"); font-weight:400; font-style:italic; font-display:swap; }
@font-face { font-family:"Basier Mono"; src:url("fonts/basiercirclemono-regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Basier Mono"; src:url("fonts/basiercirclemono-medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"Basier Mono"; src:url("fonts/basiercirclemono-semibold.woff2") format("woff2"); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:"Basier Circle"; src:url("fonts/basiercircle-regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Basier Circle"; src:url("fonts/basiercircle-medium.woff2") format("woff2"); font-weight:500; font-style:normal; font-display:swap; }