:root {
  color-scheme: dark;
  --ds-font-sans: Pretendard, "Noto Sans KR", Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ds-color-bg: #0a0a0b;
  --ds-color-surface: #111113;
  --ds-color-surface-raised: #18181b;
  --ds-color-line: rgba(255,255,255,.09);
  --ds-color-text: #f7f7f8;
  --ds-color-muted: #929299;
  --ds-color-accent: #ff6a1a;
  --ds-focus: #ff9248;
  --ds-select-bg: #fff;
  --ds-select-text: #111;
  --ds-content-max: 1200px;
  --ds-readable-max: 820px;
  --ds-gutter: clamp(16px,3vw,40px);
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 20px;
  --ds-space-6: 24px;
  --ds-space-8: 32px;
  --ds-control-sm: 36px;
  --ds-control-md: 44px;
  --ds-control-lg: 52px;
  --ds-radius-sm: 8px;
  --ds-radius-md: 12px;
  --ds-radius-lg: 20px;
  --ds-motion-fast: 160ms;
  --ds-motion-normal: 320ms;
  --ds-motion-ease: cubic-bezier(.22,.76,.24,1);
  --ds-layer-toast: 4000;
  --ds-safe-top: env(safe-area-inset-top,0px);
  --ds-safe-right: env(safe-area-inset-right,0px);
  --ds-safe-bottom: env(safe-area-inset-bottom,0px);
  --ds-safe-left: env(safe-area-inset-left,0px);
}

*,*::before,*::after { box-sizing: border-box; }
html { min-width: 320px; -webkit-text-size-adjust: 100%; }
body { overflow-wrap: anywhere; }
button,input,select,textarea { font: inherit; }
button,a { -webkit-tap-highlight-color: transparent; }
img,video,svg,canvas { max-width: 100%; }

/* Native select menus use one high-contrast palette on every surface. */
select {
  color-scheme: light;
  background-color: var(--ds-select-bg) !important;
  color: var(--ds-select-text) !important;
}

select option,
select optgroup {
  background: var(--ds-select-bg) !important;
  color: var(--ds-select-text) !important;
}

:where(button,a,input,select,textarea,[tabindex]):focus-visible {
  outline: 2px solid var(--ds-focus);
  outline-offset: 2px;
}

:where(button,[role="button"]):disabled,
:where(button,[role="button"])[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: .48;
}

.ui-container {
  width: min(calc(100% - (var(--ds-gutter) * 2)),var(--ds-content-max));
  margin-inline: auto;
}

.ui-readable { width: min(100%,var(--ds-readable-max)); margin-inline: auto; }
.ui-scroll-x { min-width: 0; overflow-x: auto; overscroll-behavior-inline: contain; }
.ui-scroll-y { min-height: 0; overflow-y: auto; overscroll-behavior-block: contain; }
.ui-modal-panel { max-width: calc(100vw - (var(--ds-gutter) * 2)); max-height: calc(100dvh - (var(--ds-gutter) * 2)); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; clip-path: inset(50%); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (max-width: 760px) {
  :root { --ds-gutter: 16px; --ds-radius-lg: 16px; }
  .ui-modal-panel { max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); }
}