/* Portfolio Figma 2545:35365: optimized 1440 x 900 composition. */
@font-face {
  font-family: "Alibaba PuHuiTi Bold";
  src: url("assets/AlibabaPuHuiTi-Bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

:root {
  color-scheme: light;
  --color-brand-primary: #fd5904;
  --color-brand-on-primary: #fff;
  --color-text-primary: #10100f;
  --color-text-secondary: #575751;
  --color-text-tertiary: #74746d;
  --color-background-canvas: #f0f0f0;
  --color-background-halo: #fffdf3;
  --color-background-surface: #fff;
  --color-background-frame: #565650;
  --color-background-device: #e5e5e0;
  --color-border-focus: #d34800;
  --color-border-default: #d9d9d3;
  --color-function-info: #deefff;
  --color-function-warning: #ffb21c;
  --color-device-led-off: #dedbd5;
  --color-device-led-border: #b8b4ac;
  --color-device-led-surround: #e9e5e0;
  --color-device-led-power: #b9e6ff;
  --color-device-led-print: #fff0c7;
  --color-slot-black: #070707;
  --color-slot-metal: #8c8880;
  --color-slot-shadow: #302f2b;
  --color-shadow: #171715;
  --color-shadow-soft: rgb(23 23 21 / 8%);
  --color-shadow-medium: rgb(23 23 21 / 14%);
  --color-shadow-dense: rgb(23 23 21 / 28%);
  --color-control-hover: rgb(255 255 255 / 12%);
  --color-control-pressed: rgb(23 23 21 / 14%);
  --color-control-action-hover: color-mix(in srgb, var(--color-text-primary) 90%, var(--color-background-surface));
  --color-paper-edge: #f5f5f1;
  --color-paper-fiber: rgb(90 87 73 / .6%);
  --color-paper-crease: rgb(60 57 45 / 4%);
  --color-paper-bright: rgb(255 255 255 / 80%);
  --color-tooltip-surface: rgb(250 250 248 / 96%);
  --font-sans: "Alibaba PuHuiTi", "Microsoft YaHei", system-ui, sans-serif;
  --font-heading: "Alibaba PuHuiTi Bold", var(--font-sans);
  --font-label: "IBM Plex Sans", var(--font-sans);
  --font-body: "PingFang SC", var(--font-sans);
  --space-xs: 4px; --space-sm: 8px; --space-lg: 16px; --space-xl: 20px; --space-2xl: 24px;
  --navigation-inline-start: 32px;
  --navigation-wide-inline-start: 52px;
  --radius-sm: 6px; --radius-md: 10px; --radius-full: 999px;
  --control-height: 44px;
  --navigation-padding-block: var(--space-sm);
  --navigation-height: calc(var(--control-height) + 2 * var(--navigation-padding-block));
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --duration-press: 140ms; --duration-feedback: 200ms;
  --duration-cursor: 400ms; --duration-paper-dismiss: 200ms;
  --cursor-hit-radius: 16px;
  --duration-title-entry: 1000ms; --title-entry-stagger: 260ms;
  --duration-title-return: 300ms; --title-return-stagger: 70ms;
  --duration-about-entry: 420ms; --about-entry-stagger: 90ms;
  --delay-about-print: 680ms; --delay-copy-entry: 80ms;
  --duration-copy-entry: 240ms; --copy-entry-stagger: 50ms; --duration-copy-exit: 140ms;
  --duration-print-content: 1600ms;
  --duration-title-exit: 260ms; --title-exit-stagger: 70ms;
  --duration-line-entry: 700ms; --duration-line-exit: 320ms;
  --duration-paper-float: 2400ms;
  --shadow-paper: 0 8px 24px var(--color-shadow-soft);
  --works-xr-ink: #10213f;
  --works-xr-base: #eef4fc;
  --works-xr-frame: #2f405f;
  --works-dash-base: #eee;
  --color-project-placeholder: #d9d9d9;
  --color-dialog-backdrop: rgb(23 23 21 / 32%);
  --duration-project-lift: 500ms; --duration-project-return: 430ms; --duration-project-preview: 240ms;
}