.mac-app-thumb--blue { background: linear-gradient(140deg, #dbeafe, #e0e7ff); }
.mac-app-thumb--red { background: linear-gradient(140deg, #ffe4e6, #ffedd5); }
.mac-app-thumb--purple { background: linear-gradient(140deg, #ede9fe, #fae8ff); }
.mac-app-thumb--teal { background: linear-gradient(140deg, #ccfbf1, #e0f2fe); }
.mac-app-thumb--green { background: linear-gradient(140deg, #dcfce7, #ccfbf1); }
.mac-app-thumb .mac-app-icon { width: 112px; height: 112px; object-fit: contain; object-position: center; border-radius: 24px; box-shadow: 0 12px 28px #0f172a24; }
.mac-app-thumb .work-thumb-type { color: #334155; background: #ffffffb3; }
.mac-app-status { color: #92400e; background: #fffbeb; border: 1px solid #fde68a; }
#mac-apps { scroll-margin-top: 80px; }
.works-category-desc a { color: #1d4ed8; }
.apps-page a:focus-visible, .work-card--link:focus-visible { outline: 3px solid #2563eb; outline-offset: 4px; }
.apps-skip-link { position: absolute; left: 1rem; top: -5rem; z-index: 200; padding: .5rem 1rem; background: white; color: #1d4ed8; }
.apps-skip-link:focus { top: .5rem; }
.apps-main { max-width: 960px; margin: auto; padding: 0 1.5rem 3rem; }
.apps-intro { padding: 4rem 0 2rem; }
.apps-intro h1 { font-size: clamp(2rem, 5vw, 3.25rem); line-height: 1.35; letter-spacing: -.035em; margin-bottom: 1.25rem; }
.apps-lead { color: #475569; font-size: 1rem; line-height: 1.9; }
.apps-development-note { margin-top: 2rem; padding: 1rem 1.25rem; border: 1px solid #fde68a; border-radius: 12px; background: #fffbeb; }
.apps-development-note strong { color: #92400e; font-size: .875rem; }
.apps-development-note p { color: #57534e; font-size: .875rem; margin-top: .25rem; }
.apps-jump-links { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; }
.apps-jump-links a { border: 1px solid #cbd5e1; border-radius: 999px; padding: .45rem .85rem; color: #334155; font-size: .875rem; text-decoration: none; }
.apps-jump-links a:hover { background: #eff6ff; border-color: #2563eb; }
.app-detail { scroll-margin-top: 80px; padding: 2rem; margin: 1.5rem 0; border: 1px solid #e2e8f0; border-radius: 20px; background: white; box-shadow: 0 6px 24px #0f172a05; }
.app-detail-heading { display: flex; gap: 1.25rem; align-items: center; }
.app-detail-heading img { border-radius: 18px; flex-shrink: 0; }
.app-detail-heading h2 { font-size: 1.65rem; margin-top: .25rem; }
.app-tagline { font-size: 1.125rem; font-weight: 600; margin: 1.5rem 0 .5rem; }
.app-detail > p:not(.app-tagline) { color: #475569; }
.app-detail h3 { font-size: .875rem; margin: 1.5rem 0 .5rem; }
.app-features { padding-left: 1.25rem; color: #475569; font-size: .9375rem; }
.app-features li + li { margin-top: .25rem; }
.app-detail .app-release-note { font-size: .8125rem; margin: 1.5rem 0 .5rem; }
.apps-support { border-radius: 16px; background: #f1f5f9; padding: 2rem; margin-top: 3rem; }
.apps-support h2 { font-size: 1.25rem; margin-bottom: .5rem; }
.apps-support p { color: #475569; font-size: .9375rem; }
.apps-support-links { display: flex; gap: 1.5rem; flex-wrap: wrap; align-items: center; margin-top: 1.25rem; }
.apps-support-links a:not(.contact-link), .apps-page .footer a { color: #1d4ed8; }
.apps-updated { text-align: right; margin-top: 1.5rem; color: #64748b; font-size: .75rem; }
@media (max-width: 640px) {
  .apps-main { padding-left: 1.25rem; padding-right: 1.25rem; }
  .apps-intro { padding-top: 2.5rem; }
  .app-detail, .apps-support { padding: 1.25rem; border-radius: 14px; }
  .app-detail-heading { gap: 1rem; }
  .app-detail-heading img { width: 64px; height: 64px; border-radius: 14px; }
  .app-detail-heading h2 { font-size: 1.4rem; }
  .apps-page .header-nav { gap: .75rem; }
  .apps-page .header-nav a { font-size: .75rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }