/*
 * G-1 공통 화면 계약. 기존 앱은 data-marlabs-ui="g-1"를 선언하기 전까지
 * 영향을 받지 않는다. v2는 뼈대(m2-*), 이 파일은 새 화면의 표면·위계 규칙이다.
 */
[data-marlabs-ui="g-1"] {
  --g1-canvas-light: #f2f2f7;
  --g1-surface-primary-light: #ffffff;
  --g1-surface-panel-light: #e9eff5;
  --g1-text-light: #18212b;
  --g1-text-muted-light: #5b6878;
  --g1-border-light: #d5dde7;
  --g1-accent: #c95d2b;
  --g1-accent-strong: #a9461f;
  --g1-focus: #2563eb;
  --g1-scroll-track: transparent;
  --g1-scroll-thumb: #b7c2d0;
  --g1-canvas: var(--g1-canvas-light);
  --g1-surface-primary: var(--g1-surface-primary-light);
  --g1-surface-panel: var(--g1-surface-panel-light);
  --g1-text: var(--g1-text-light);
  --g1-text-muted: var(--g1-text-muted-light);
  --g1-border: var(--g1-border-light);
  --g1-shadow: 0 8px 20px rgb(23 32 45 / 8%), 0 1px 3px rgb(23 32 45 / 6%);
  color: var(--g1-text);
  background: var(--g1-canvas);
  color-scheme: light;
}

[data-theme="dark"] [data-marlabs-ui="g-1"] {
  --g1-canvas: #11110f;
  --g1-surface-primary: #191815;
  --g1-surface-panel: #24221e;
  --g1-text: #f4f2ed;
  --g1-text-muted: #b8b2a8;
  --g1-border: #444038;
  --g1-focus: #8ab4f8;
  --g1-scroll-thumb: #625d55;
  --g1-shadow: none;
  color-scheme: dark;
}

[data-marlabs-ui="g-1"] .g1-shell {
  min-height: 100%;
  background: var(--g1-canvas);
  color: var(--g1-text);
}

[data-marlabs-ui="g-1"] .g1-card {
  background: var(--g1-surface-primary);
  border: 1px solid var(--g1-border);
  border-radius: 20px;
  box-shadow: var(--g1-shadow);
}

[data-marlabs-ui="g-1"] .g1-sidebar {
  background: var(--g1-surface-primary);
  border: 1px solid var(--g1-border);
  border-radius: 20px;
  box-shadow: var(--g1-shadow);
}

[data-marlabs-ui="g-1"] .g1-card { padding: 24px; }

[data-marlabs-ui="g-1"] .g1-panel {
  background: var(--g1-surface-panel);
  border: 1px solid color-mix(in srgb, var(--g1-border) 78%, transparent);
  border-radius: 14px;
  padding: 16px;
}

[data-marlabs-ui="g-1"] .g1-sidebar { border-radius: 0; }

[data-marlabs-ui="g-1"] .g1-nav-item {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 10px;
  color: var(--g1-text-muted);
  display: flex;
  font-weight: 650;
  gap: 10px;
  min-height: 40px;
  padding: 0 12px;
}

[data-marlabs-ui="g-1"] .g1-nav-item[aria-current="page"] {
  background: var(--g1-accent);
  color: #fff;
}

[data-marlabs-ui="g-1"] .g1-button,
[data-marlabs-ui="g-1"] .g1-input {
  border-radius: 10px;
  font: inherit;
  min-height: 40px;
}

[data-marlabs-ui="g-1"] .g1-button {
  background: var(--g1-accent);
  border: 1px solid var(--g1-accent-strong);
  box-shadow: 0 2px 0 var(--g1-accent-strong);
  color: #fff;
  cursor: pointer;
  font-weight: 700;
  padding: 0 14px;
}

[data-marlabs-ui="g-1"] .g1-button:active { box-shadow: none; transform: translateY(2px); }
[data-theme="dark"] [data-marlabs-ui="g-1"] .g1-button { box-shadow: none; }

[data-marlabs-ui="g-1"] .g1-input {
  background: var(--g1-surface-primary);
  border: 1px solid var(--g1-border);
  color: var(--g1-text);
  padding: 0 12px;
  width: 100%;
}

[data-marlabs-ui="g-1"] :is(.g1-button, .g1-input):focus-visible {
  outline: 3px solid color-mix(in srgb, var(--g1-focus) 45%, transparent);
  outline-offset: 2px;
}

[data-marlabs-ui="g-1"] .g1-table { border-collapse: collapse; width: 100%; }
[data-marlabs-ui="g-1"] .g1-table :is(th, td) { border-bottom: 1px solid var(--g1-border); padding: 12px; text-align: left; }
[data-marlabs-ui="g-1"] .g1-table th { color: var(--g1-text-muted); font-size: 0.8125rem; font-weight: 700; }
[data-marlabs-ui="g-1"] * { scrollbar-color: var(--g1-scroll-thumb) var(--g1-scroll-track); }