/* ============================================================
   KRAFTWERK — Control Panel  |  style.css
   ──────────────────────────────────────────────────────────
   Architecture : @layer, CSS nesting, @container queries,
                  style queries (@container style())
   Themes       : light (default) + dark (prefers-color-scheme)
   Fonts        : Special Elite (title), VT323 (UI)
   JS           : range script only (permitted)
   State        : :target for plant on/off, checkboxes for switches

   Partials
   ├── css/tokens.css      Design tokens & colour themes
   ├── css/base.css        Reset, body, hidden inputs, typography
   ├── css/layout.css      Panel shell & section slots
   ├── css/components.css  Gauge · LED · switch · knob · button · display
   ├── css/animations.css  @keyframes + reduced-motion overrides
   ├── css/state.css       :target / checkbox driven state
   ├── css/easter-eggs.css Hidden details & interactions
   └── css/responsive.css  Container & media queries
   ============================================================ */

/* Layer declaration order must come first */
@layer reset, tokens, base, layout, components, state;

@import url("css/tokens.css");
@import url("css/base.css");
@import url("css/layout.css");
@import url("css/components.css");
@import url("css/animations.css");
@import url("css/state.css");
@import url("css/easter-eggs.css");
@import url("css/responsive.css");