@layer base {
  :focus-visible { outline: 3px solid var(--sc-focus); outline-offset: 3px; }
  button:not(:disabled), summary { cursor: pointer; }
  [id] { scroll-margin-top: 2rem; }
}
@layer components {
  .sc-btn { @apply inline-flex min-h-11 items-center justify-center gap-2 rounded-control border border-brand bg-brand px-5 py-2.5 text-sm font-bold text-on-brand transition-colors hover:border-brand-hover hover:bg-brand-hover active:bg-brand-active disabled:cursor-not-allowed disabled:border-line disabled:bg-line disabled:text-muted; }
  .sc-btn-secondary { @apply border-control bg-surface text-brand-link hover:border-control hover:bg-tint active:bg-tint; }
  .sc-btn-danger { @apply border-danger bg-danger-soft text-danger hover:border-danger hover:bg-danger-soft active:bg-danger-soft; }
  .sc-input { @apply block min-h-11 w-full rounded-control border border-control bg-surface px-3 py-2.5 text-sm text-ink placeholder:text-muted disabled:cursor-not-allowed disabled:bg-tint; }
  .sc-input[aria-invalid=true] { @apply border-2 border-danger; }
  .sc-label { @apply mb-2 block text-sm font-bold; }
  .sc-help { @apply mt-2 text-xs leading-relaxed text-muted; }
  .sc-card { @apply rounded-card border border-line bg-surface p-6; }
  .sc-badge { @apply inline-flex items-center gap-1.5 rounded-full bg-tint px-3 py-1 text-xs font-bold text-brand-link; }
  .sc-badge-neutral { @apply bg-tint text-muted; }
  .sc-badge-warning { @apply bg-warning-soft text-warning; }
  .sc-badge-danger { @apply bg-danger-soft text-danger; }
  .sc-badge-info { @apply bg-info-soft text-info; }
  .sc-alert { @apply rounded-control border border-control bg-info-soft p-4 text-sm leading-relaxed text-info; }
  .sc-alert-warning { @apply bg-warning-soft text-warning; }
  .sc-alert-danger { @apply border-danger bg-danger-soft text-danger; }
  .sc-table-frame { @apply overflow-x-auto rounded-card border border-line bg-surface; }
  .sc-table { @apply w-full border-collapse text-left text-sm; }
  .sc-table caption { @apply px-4 py-3 text-left font-bold; }
  .sc-table th { @apply bg-tint px-4 py-3 text-xs font-bold text-muted; }
  .sc-table td { @apply border-t border-line px-4 py-4; }
  .sc-empty { @apply rounded-card border border-dashed border-control bg-surface px-6 py-12 text-center; }
  .sc-node { @apply block w-full rounded-card border border-control bg-surface p-4 text-left; }
  .sc-node[aria-pressed=true] { @apply border-2 border-brand bg-tint; }
  .sc-close { @apply relative inline-flex size-6 shrink-0 items-center justify-center rounded border-0 bg-transparent p-1 text-current opacity-65 hover:opacity-100 disabled:cursor-not-allowed disabled:opacity-30; }
  .sc-tab { @apply min-h-11 rounded-control px-4 py-2 text-sm font-bold text-muted hover:bg-tint; }
  .sc-tab[aria-selected=true] { @apply bg-tint text-brand-link; }
  .sc-btn[aria-pressed=true], .sc-btn[aria-current=page] { @apply border-brand bg-tint text-brand-link; }
  .sc-spy-link { @apply rounded-control p-3 text-muted hover:bg-tint; }
  .sc-spy-link[aria-current=location] { @apply bg-tint font-bold text-brand-link; }
  .sc-tooltip { @apply invisible absolute left-0 top-full z-10 mt-2 w-64 rounded-control border border-control bg-surface p-3 text-xs leading-relaxed text-ink opacity-0 group-hover:visible group-hover:opacity-100 group-focus-within:visible group-focus-within:opacity-100; }
  .sc-progress { @apply h-3 w-full overflow-hidden rounded-full; }
}
.sc-close::before, .sc-close::after {
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:1rem;
  height:1.5px;
  border-radius:1px;
  background:currentColor;
}
.sc-close::before { transform:translate(-50%,-50%) rotate(45deg); }
.sc-close::after { transform:translate(-50%,-50%) rotate(-45deg); }
progress.sc-progress { appearance:none; background:var(--sc-line); color:var(--sc-brand); }
progress.sc-progress::-webkit-progress-bar { background:var(--sc-line); }
progress.sc-progress::-webkit-progress-value { background:var(--sc-brand); }
progress.sc-progress::-moz-progress-bar { background:var(--sc-brand); }
/* Preserve semantic hidden states regardless of flex/grid utility declarations. */
[hidden] { display:none !important; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* DaisyUI emits components in Tailwind's utilities layer. Keep accessibility
   contracts unlayered so its size/focus modifiers cannot override them. */
:focus-visible { outline: 3px solid var(--sc-focus); outline-offset: 3px; }
.input:focus-within { outline: 3px solid var(--sc-focus); outline-offset: 3px; }

 .btn { min-height: 44px; height: auto; padding-block: .65rem; font-weight: 700; }
 .btn-primary:hover { background: var(--sc-brand-hover); border-color: var(--sc-brand-hover); }
 .btn-primary:active { background: var(--sc-brand-active); }
 .input, .select, .textarea { border-color: var(--sc-control); min-height: 44px; max-width: 100%; }
 .input[aria-invalid=true], .textarea[aria-invalid=true] { border-color: var(--sc-danger); }
 .card { border: 1px solid var(--sc-line); box-shadow: none; }
 .btn-circle, .btn-square { min-width: 44px; }

@layer components {
 .sc-avatar { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0; background: var(--sc-tint); color: var(--sc-brand-link); border-radius: 50%; font-weight: 700; }
 .sc-message { max-width: 72ch; overflow-wrap: anywhere; padding: 1.25rem; border: 1px solid var(--sc-line); border-radius: .75rem; background: var(--sc-surface); }
 .sc-message p + p { margin-top: .75rem; }
 .sc-prose { line-height: 1.6; overflow-wrap: anywhere; }
 .sc-prose ul { list-style: disc; padding-left: 1.5rem; }
 .sc-prose ol { list-style: decimal; padding-left: 1.5rem; }
 .sc-prose pre { overflow-x: auto; padding: 1rem; background: var(--sc-canvas); border-radius: .5rem; }
 .sc-prose code { font-family: var(--font-mono); }
 .sc-prose a { color: var(--sc-brand-link); text-decoration: underline; }
 .sc-prose table { display: block; overflow-x: auto; }
 .sc-dialog { margin: auto; width: min(36rem, calc(100% - 2rem)); max-height: 85dvh; overflow: auto; padding: 1.5rem; border: 1px solid var(--sc-control); border-radius: 1rem; background: var(--sc-surface); color: var(--sc-ink); }
 .sc-dialog::backdrop { background: rgb(0 0 0 / .55); }
 .sc-diff ins { background: var(--sc-success-soft); color: var(--sc-success); text-decoration: none; }
 .sc-diff del { background: var(--sc-danger-soft); color: var(--sc-danger); }
 .sc-workspace { display: grid; grid-template-columns: 240px minmax(0,1fr); border: 1px solid var(--sc-line); border-radius: .75rem; overflow: hidden; }
 .sc-workspace > aside { background: var(--sc-canvas); padding: 1rem; border-right: 1px solid var(--sc-line); }
 .sc-workspace > section { min-width: 0; padding: 1rem; background: var(--sc-surface); }
 .sc-close { min-width: 44px; min-height: 44px; opacity: 1; }
}
@media (max-width: 767px) { .sc-workspace { grid-template-columns: minmax(0,1fr); } .sc-workspace > aside { display: none; } }
