/* Inside the `dreamdesk` cascade layer, so any unlayered app CSS overrides it
   regardless of specificity. Apps with global resets should layer them first:
   @layer reset, dreamdesk; */
@layer dreamdesk {

html, body, #root {
  margin: 0;
  padding: 0;
  overflow: hidden;
  height: 100%;
}

dreamdesk-toggle { display: inline-block; }
dreamdesk-toast,
dreamdesk-input,
dreamdesk-tabs,
dreamdesk-progress-bar { display: block; }

:root {
  /* Core Colors - Keep for backward compatibility */
  --pink: #ff6fb2;
  --jade: #20ffb6;
  --yellow: #f8e730;
  --purple: #9d7eff;
  --black: #151820;
  --grey: #888888;

  /* Typography */
  --font-ui: "Menlo", "Courier New", monospace;
  --font-size-base: 16px;

  /* Border */
  --border: 0.09rem solid var(--black);

  /* Window sizes utilities */
  --window-width: 24rem;
  --window-height: 12.5rem;
  --window-radius: 0.25rem;

  --win-width-sm: 24rem;
  --win-width-md: 34rem;
  --win-width-lg: 54rem;
}

} /* @layer dreamdesk */