/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/.pnpm/next@15.5.18_@babel+core@7.29.0_react-dom@19.2.6_react@19.2.6__react@19.2.6/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/.pnpm/next@15.5.18_@babel+core@7.29.0_react-dom@19.2.6_react@19.2.6__react@19.2.6/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./src/app/globals.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
:root {
  /* Color Palette - UCD 暗夜工程师主题 */
  --color-primary: #3B82F6;
  --color-primary-hover: #60A5FA;
  --color-primary-muted: #1E3A5F;
  --color-secondary: #8B5CF6;
  --color-bg-primary: #0F1117;
  --color-bg-secondary: #1A1D27;
  --color-bg-tertiary: #242731;
  --color-bg-elevated: #2A2D37;
  --color-text-primary: #E5E7EB;
  --color-text-secondary: #9CA3AF;
  --color-text-muted: #6B7280;
  --color-success: #10B981;
  --color-warning: #F59E0B;
  --color-error: #EF4444;
  --color-border: #2D3141;
  --color-border-focus: #3B82F6;
  --color-terminal-bg: #0A0C10;
  --color-terminal-text: #D4D4D8;
  --color-terminal-green: #4ADE80;

  /* Typography */
  --font-heading-1: 700 24px/32px 'Inter', 'Noto Sans SC', sans-serif;
  --font-heading-2: 600 18px/24px 'Inter', 'Noto Sans SC', sans-serif;
  --font-heading-3: 600 14px/20px 'Inter', 'Noto Sans SC', sans-serif;
  --font-body: 400 14px/20px 'Inter', 'Noto Sans SC', sans-serif;
  --font-body-small: 400 12px/16px 'Inter', 'Noto Sans SC', sans-serif;
  --font-label: 500 12px/16px 'Inter', 'Noto Sans SC', sans-serif;
  --font-code: 400 13px/20px 'JetBrains Mono', 'Fira Code', monospace;
  --font-terminal: 400 14px/20px 'JetBrains Mono', 'Menlo', monospace;

  /* Spacing */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;

  /* Border Radius */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);
}

/* Global resets and base styles */
body {
  margin: 0;
  padding: 0;
  background-color: var(--color-bg-primary);
  color: var(--color-text-primary);
  font: var(--font-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* xterm.js terminal scrollbar */
.xterm { padding: 8px; }
.xterm-viewport::-webkit-scrollbar { width: 6px; }
.xterm-viewport::-webkit-scrollbar-track { background: transparent; }
.xterm-viewport::-webkit-scrollbar-thumb { background: #2D3141; border-radius: 3px; }
.xterm-viewport::-webkit-scrollbar-thumb:hover { background: #6B7280; }

/* ==========================================
   Responsive Layout — Feature 19 (NFR-009)
   ========================================== */

/* Bottom tab nav: hidden on desktop/tablet, shown on mobile */
.bottom-tab-nav {
  display: none;
}

/* Mobile layout (<768px): no sidebar, bottom tab navigation */
@media (max-width: 767px) {
  .project-sidebar {
    display: none !important;
  }

  .bottom-tab-nav {
    display: flex !important;
  }

  .project-main-content {
    padding-bottom: 56px;
  }

  .project-grid,
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }
}

/* Tablet layout (768-1023px): sidebar collapses to 60px icon-only */
@media (min-width: 768px) and (max-width: 1023px) {
  .project-sidebar {
    width: 60px !important;
    min-width: 60px !important;
    overflow: hidden;
  }

  .project-sidebar h2,
  .project-sidebar button.create-project-btn,
  .project-sidebar .project-list-item {
    font-size: 0;
    overflow: hidden;
  }

  .project-sidebar .project-list-item::first-line {
    font-size: 0;
  }

  .bottom-tab-nav {
    display: none !important;
  }

  .project-grid,
  [style*="grid-template-columns"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Desktop layout (>=1024px): full 240px sidebar */
@media (min-width: 1024px) {
  .project-sidebar {
    width: 240px !important;
    min-width: 240px !important;
  }

  .bottom-tab-nav {
    display: none !important;
  }

  .project-grid,
  [style*="grid-template-columns"] {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}