:root {
  --project-bg: #FAFAF8;
  --project-ink: #16161A;
  --project-muted: #626269;
  --project-yellow: #FFE019;
  --project-red: #B7161E;
  --project-border: #D5D5D3;
  --project-radius: 18px;
  --project-gap: 16px;
  --project-ease: cubic-bezier(0.16,1,0.3,1);
  --ui-focus-ring: #16161A;
}
.project-toolbar { display:flex; align-items:end; justify-content:space-between; flex-wrap:wrap; gap:24px; margin-bottom:28px; }
.project-filters { display:flex; flex-wrap:wrap; gap:8px; }
.project-filter, .project-reset, .project-step { font:600 14px Manrope, sans-serif; min-height:44px; padding:10px 18px; border:1px solid var(--project-border); border-radius:999px; background:transparent; color:var(--project-ink); cursor:pointer; }
.project-filter[aria-pressed="true"] { background:var(--project-yellow); border-color:var(--project-ink); }
.project-filter span { font:12px 'JetBrains Mono',monospace; margin-left:8px; }
.project-filter:disabled, .project-step:disabled { opacity:.45; cursor:default; }
.project-search { display:flex; flex-direction:column; gap:8px; flex:0 1 280px; font:500 13px Manrope,sans-serif; color:var(--project-muted); }
.project-search input { width:100%; min-height:44px; padding:10px 16px; font:16px Manrope,sans-serif; background:#fff; color:var(--project-ink); border:1px solid #85858A; border-radius:12px; transition:border-color 160ms var(--project-ease),outline-offset 160ms var(--project-ease); }
.project-search input::placeholder { color:var(--project-muted); }
.project-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--project-gap); }
.project-card { min-width:0; display:flex; flex-direction:column; align-items:stretch; gap:16px; padding:24px; border:1px solid var(--project-border); border-radius:var(--project-radius); background:#fff; color:var(--project-ink); text-decoration:none; font-family:Manrope,Helvetica,sans-serif; }
.project-card:visited { color:var(--project-ink); }
.project-card:hover { border-color:var(--project-ink); color:var(--project-ink); }
.project-card-top { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.project-icon { width:64px; height:64px; object-fit:contain; border-radius:14px; flex-shrink:0; }
.project-kind { font:11px/1.5 'JetBrains Mono',monospace; color:var(--project-red); text-transform:uppercase; letter-spacing:.06em; text-align:right; }
.project-card h3 { margin:0; color:var(--project-ink); font-size:22px; line-height:1.25; font-weight:700; }
.project-subtitle { font-size:13px; line-height:1.6; color:var(--project-muted); margin-top:8px; }
.project-description { margin:0; color:var(--project-muted); font-size:15px; line-height:1.6; }
.project-card-action { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:auto; padding-top:16px; border-top:1px solid var(--project-border); font-size:14px; line-height:1.5; font-weight:700; }
.project-arrow { transition:transform 200ms var(--project-ease); }
.project-card:hover .project-arrow { transform:translateX(4px); }
.project-empty { padding:40px 0; color:var(--project-muted); }
.project-empty p { margin:0 0 16px; }
.project-status { margin:16px 0 0; font:13px Manrope,sans-serif; color:var(--project-muted); }
.project-strip { display:flex; gap:var(--project-gap); overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-padding:4px; padding:4px 4px 16px; scrollbar-color:#85858A var(--project-bg); scrollbar-width:thin; }
.project-strip .project-card { flex:0 0 340px; scroll-snap-align:start; }
.project-rail-nav { display:flex; gap:8px; justify-content:flex-end; margin-top:16px; }
.project-step { padding:8px; width:44px; display:inline-flex; align-items:center; justify-content:center; font-size:20px; }
.project-rail-title { display:flex; align-items:end; justify-content:space-between; flex-wrap:wrap; gap:24px; margin-bottom:28px; }
.project-all { display:inline-flex; align-items:center; gap:12px; min-height:44px; padding:10px 20px; border:1px solid var(--project-border); border-radius:999px; text-decoration:none; font:600 14px Manrope,sans-serif; color:var(--project-ink); }
.project-all:hover { color:var(--project-ink); border-color:var(--project-ink); }
[data-project-catalog] [hidden], [data-project-rail] [hidden] { display:none !important; }
.project-search input:focus-visible, .project-strip:focus-visible { outline:2px solid var(--project-ink); outline-offset:4px; }
@media(max-width:1000px){ .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media(max-width:620px){ .project-grid{grid-template-columns:minmax(0,1fr);} .project-search{flex:1 0 100%;} .project-strip .project-card{flex-basis:min(340px,86%);} .project-card{padding:24px;} .project-toolbar{gap:16px;} }
@media(prefers-reduced-motion:reduce){ .project-arrow{transition:none;} .project-strip{scroll-behavior:auto;} }