Prisma says@import pulls one stylesheet into another — convenient, but it can slow loading.
@import url("base.css") at the top of a stylesheet loads another. Handy for organizing CSS, but imports load sequentially, delaying rendering. For production, prefer multiple <link> tags or a build step that bundles. @import can carry media conditions.
Power-ups you unlock
@import url(...) loads another stylesheet
Must come before other rules
Sequential loading → slower than parallel <link>s
Prefer <link>/bundling in production
Jank the Janitor attacks — common mistakes
Chains of @imports tanking performance
Placing @import after other rules (ignored)
Using it where a build step should bundle
Boss battleNote where @import must go and why three <link>s beat three @imports.
Example code
<!doctype html><html><head><meta charset="utf-8">
<style>/* @import url("base.css"); must be first */ body{background:#06040d;color:#e6e0ff;padding:20px}</style></head><body><p>@import must precede all other rules — and loads serially.</p></body></html>