/* ── Interface polish (make-interfaces-feel-better) ── */

:root {
  --image-outline: 1px solid rgba(0, 0, 0, 0.1);
}

html {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: rgba(196, 135, 62, 0.14);
}

h1, h2, h3,
.hero-title,
.hero h1,
.section-header-row h2,
.sp-title,
.modal-title,
.theory-modal-title,
.all-fw-name,
.fw-card-name {
  text-wrap: balance;
}

p,
.hero-sub,
.sp-prose,
.sp-subtitle,
.card-desc,
.fw-card-desc,
.all-fw-desc,
.section-header-row p {
  text-wrap: pretty;
}

.hero-stat-num,
.dashboard-result-count strong,
.header-meta .count,
#patternCount,
#patternCountHeader,
.meta-value,
.ms-filter-option-count,
.filter-pill-count,
.usearch-result-count {
  font-variant-numeric: tabular-nums;
}

/* Image outlines */
.card-thumb img,
.card-thumb video,
.modal-thumb img,
.modal-thumb video,
.sp-hero-img-wrap img,
.sp-hero-img-wrap video,
.sp-related-thumb img,
.sp-related-thumb video,
.framework-pattern-minicard-thumb img,
.framework-pattern-minicard-thumb video,
.all-fw-thumb img {
  outline: var(--image-outline);
  outline-offset: -1px;
}

.site-nav-link,
.mobile-bottom-nav-item,
.nav-search-trigger,
.hero-cta,
.clear-filters-btn {
  transition: var(--transition-interactive);
}

/* Press feedback — buttons only (0.96) */
button:not(:disabled):active,
.sidepeek-close-btn:active,
.nav-search-trigger:active,
.ms-filter-trigger:active,
.ms-filter-option:active,
.clear-filters-btn:active,
.active-filter-chip:active,
.filter-apply-btn:active,
.filter-clear-btn:active,
.hero-cta:active,
.usearch-result-item:active {
  transform: scale(0.96);
}

/* Card surfaces — lighter press so hover lift still reads */
.card:active,
.fw-card:active,
.all-fw-card:active,
.sp-related-card:active,
.company-card:active {
  transform: scale(0.98);
}

/* Minimum hit areas for bottom nav tabs */
.mobile-bottom-nav-item,
.mobile-bottom-nav-search {
  position: relative;
  min-height: 44px;
}

.bottom-sheet-close {
  position: relative;
  min-height: 40px;
  min-width: 40px;
}

/* Compact section rail — hit area via ::before, not min-height */
.section-rail-item {
  position: relative;
  min-height: 14px;
  min-width: 36px;
}

.section-rail-item::before,
.bottom-sheet-close::before {
  content: "";
  position: absolute;
  inset: -6px;
}

/* Layered shadows on overlays */
.ms-filter-panel,
.usearch-box {
  box-shadow: var(--shadow-layered);
}

/* Concentric radii on framework thumbs */
.fw-card-thumb,
.all-fw-thumb {
  border-radius: var(--radius-xs);
}

.ms-filter-panel {
  border-radius: var(--radius-sm);
}

.ms-filter-options {
  padding: 8px;
}

/* Sidepeek content enter — split & stagger (skip hero/thumb) */
@keyframes polish-enter {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.sidepeek-panel.open .sidepeek-body > *:not(.modal-thumb):not(.sidepeek-thumb):not(.sp-hero-img-wrap),
.sidepeek-panel.open .modal-body > * {
  animation: polish-enter 0.32s var(--ease-out) backwards;
}

.sidepeek-panel.open .sidepeek-body > *:nth-child(1),
.sidepeek-panel.open .modal-body > *:nth-child(1) { animation-delay: 0ms; }
.sidepeek-panel.open .sidepeek-body > *:nth-child(2),
.sidepeek-panel.open .modal-body > *:nth-child(2) { animation-delay: 50ms; }
.sidepeek-panel.open .sidepeek-body > *:nth-child(3),
.sidepeek-panel.open .modal-body > *:nth-child(3) { animation-delay: 100ms; }
.sidepeek-panel.open .sidepeek-body > *:nth-child(4),
.sidepeek-panel.open .modal-body > *:nth-child(4) { animation-delay: 150ms; }
.sidepeek-panel.open .sidepeek-body > *:nth-child(5),
.sidepeek-panel.open .modal-body > *:nth-child(5) { animation-delay: 200ms; }
.sidepeek-panel.open .sidepeek-body > *:nth-child(n+6),
.sidepeek-panel.open .modal-body > *:nth-child(n+6) { animation-delay: 250ms; }

.sidepeek-panel.open .sp-section {
  animation: polish-enter 0.28s var(--ease-out) backwards;
}

.sidepeek-panel.open .sp-section:nth-of-type(1) { animation-delay: 60ms; }
.sidepeek-panel.open .sp-section:nth-of-type(2) { animation-delay: 120ms; }
.sidepeek-panel.open .sp-section:nth-of-type(3) { animation-delay: 180ms; }
.sidepeek-panel.open .sp-section:nth-of-type(4) { animation-delay: 240ms; }
.sidepeek-panel.open .sp-section:nth-of-type(n+5) { animation-delay: 300ms; }

@media (prefers-reduced-motion: reduce) {
  .sidepeek-panel.open .sidepeek-body > *,
  .sidepeek-panel.open .modal-body > *,
  .sidepeek-panel.open .sp-section {
    animation: none;
  }

  button:not(:disabled):active,
  .card:active,
  .fw-card:active {
    transform: none;
  }
}

/* Hover lifts — fine pointer only (prevents sticky transform on touch) */
@media (hover: hover) and (pointer: fine) {
  .card:hover {
    border-color: var(--accent-28);
    box-shadow: var(--shadow-layered);
    transform: translateY(-2px);
  }

  .fw-card:hover,
  .all-fw-card:hover {
    border-color: var(--accent-28);
    box-shadow: var(--shadow-layered);
    transform: translateY(-1px);
  }

  .theory-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 32px rgba(15, 14, 12, 0.08);
    border-color: var(--border-h);
  }

  .company-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 40px rgba(26, 24, 21, 0.09);
    border-color: var(--accent);
  }

  .framework-card:hover,
  .pattern-card:hover,
  .problem-card:hover,
  .example-card:hover,
  .scenario-card:hover {
    transform: translateY(-2px);
  }

  .fw-pattern-minicard:hover,
  .sp-related-card:hover {
    transform: translateY(-1px);
  }

  .intent-route-card:hover,
  .extension-card:hover,
  .extension-contradiction:hover,
  .contradiction-card.is-clickable:hover {
    transform: translateY(-2px);
  }

  .related-pattern-item:hover,
  .related-pattern-card:hover {
    transform: translateY(-1px);
  }

  .hero-preview-card:hover {
    box-shadow: 0 28px 56px rgba(15, 14, 12, 0.14);
  }

  .hero-preview-card-1:hover { transform: rotate(-4.5deg) translateY(-6px); }
  .hero-preview-card-2:hover { transform: rotate(2.5deg) translateY(-6px); }
  .hero-preview-card-3:hover { transform: rotate(-1deg) translateY(-6px); }

  .sp-hero-img-wrap:hover img { transform: scale(1.018); }
}

@media (hover: none), (pointer: coarse) {
  .card:hover,
  .fw-card:hover,
  .all-fw-card:hover,
  .theory-card:hover,
  .company-card:hover,
  .framework-card:hover,
  .pattern-card:hover,
  .problem-card:hover,
  .example-card:hover,
  .scenario-card:hover,
  .fw-pattern-minicard:hover,
  .sp-related-card:hover,
  .intent-route-card:hover,
  .extension-card:hover,
  .extension-contradiction:hover,
  .contradiction-card.is-clickable:hover,
  .related-pattern-item:hover,
  .related-pattern-card:hover,
  .hero-preview-card:hover,
  .hero-preview-card-1:hover,
  .hero-preview-card-2:hover,
  .hero-preview-card-3:hover {
    transform: none;
  }
}