.work-tools { display:grid; grid-template-columns:minmax(12rem,.65fr) minmax(0,2fr); gap:clamp(2rem,6vw,6rem); margin-top:clamp(4rem,8vw,7rem); padding-block:1.5rem; border-block:1px solid var(--ink); }
.work-tools-heading .eyebrow { margin-bottom:.55rem; color:var(--copper); }.work-tools-heading h2 { max-width:12ch; margin:0; font:400 clamp(1.6rem,2.6vw,2.35rem)/1.04 var(--serif); letter-spacing:-.035em; }
.work-controls { display:grid; grid-template-columns:minmax(13rem,1.4fr) repeat(3,minmax(8.5rem,1fr)) auto; gap:.75rem; align-items:end; }.work-controls label { display:grid; gap:.38rem; min-width:0; }.work-controls label > span { display:flex; min-height:1rem; align-items:center; gap:.38rem; color:var(--muted); font:700 .62rem/1.3 var(--mono); letter-spacing:.08em; text-transform:uppercase; }.control-glyph { width:.88rem; height:.88rem; flex:0 0 auto; overflow:visible; color:var(--copper); stroke-width:1.7; }
.work-controls :is(input,select,.work-reset) { width:100%; min-height:var(--control-height); border:1px solid var(--line); border-radius:var(--surface-radius); background:var(--snow); color:var(--ink); font:700 .78rem/1.3 var(--sans); }
.work-controls :is(input,select) { padding:.65rem .72rem; transition:border-color var(--motion-fast),box-shadow var(--motion-fast),translate var(--motion-medium) var(--ease-route); }.work-controls input::placeholder { color:var(--muted); }.work-controls :is(input,select):is(:hover,:focus-visible) { border-color:var(--copper); box-shadow:inset 0 -2px var(--copper); }.work-reset { display:inline-flex; width:auto!important; align-items:center; justify-content:center; gap:.42rem; padding:.65rem .9rem; cursor:pointer; transition:background var(--motion-fast),border-color var(--motion-fast),color var(--motion-fast),translate var(--motion-medium) var(--ease-route); }.work-reset:is(:hover,:focus-visible) { border-color:var(--ink); background:var(--ink); color:var(--snow); translate:0 var(--motion-hover-lift); }.work-reset:active { translate:0; }
.work-results { grid-column:2; margin:0; color:var(--muted); font:700 .67rem/1.4 var(--mono); letter-spacing:.04em; }.work-tools[data-updates="live"] .work-results::before { content:'Live index · '; color:var(--copper); }
.index-list { margin-top:2.5rem; border-top: 1px solid var(--ink); }.index-list.is-empty::after { content:'Try a broader name, language, or project type.'; display:block; padding:3rem .5rem; border-bottom:1px solid var(--line); color:var(--muted); font:400 1.05rem/1.5 var(--sans); }.index-list a { display: grid; grid-template-columns: 1.6rem minmax(0,1fr) auto 2rem; gap:clamp(.9rem,2.4vw,2rem); align-items: center; padding: 1.8rem 1rem; border-bottom: 1px solid var(--line); text-decoration: none; transition: background var(--motion-fast),box-shadow var(--motion-fast); }.index-list a[hidden] { display:none; }.index-list a:is(:hover,:focus-visible) { background:var(--snow); box-shadow:inset 3px 0 var(--copper); }.project-glyph { width:1.45rem; height:1.45rem; overflow:visible; color:var(--muted); stroke-width:1.65; transition:color var(--motion-fast); }.index-list a:is(:hover,:focus-visible)>.project-glyph { color:var(--copper); }.index-list a>span { grid-column:2; }.index-list span { display: grid; gap: .35rem; }.index-list b { font: 400 clamp(1.4rem,3vw,2.25rem)/1.08 var(--serif); letter-spacing: -.025em; transition:color var(--motion-fast); }.index-list a:is(:hover,:focus-visible) b { color:var(--copper); }.index-list small { color: var(--muted); font-size: .84rem; line-height: 1.45; }.index-list a>i { grid-column:3; }.index-list i { color: var(--muted); font: normal 700 .73rem/1.4 var(--mono); letter-spacing: .07em; text-transform: uppercase; }.index-list a>strong { grid-column:4; }.index-list strong { font-size: 1.3rem; transition:translate var(--motion-medium) var(--ease-route),rotate var(--motion-medium) var(--ease-pop); }.index-list a:is(:hover,:focus-visible) strong { translate:.3rem 0; rotate:-8deg; }
.index-list span em { width:max-content; margin-top:.2rem; padding:.24rem .48rem; border:1px solid color-mix(in srgb,var(--copper) 42%,var(--line)); border-radius:999px; color:var(--copper); font:normal 700 .61rem/1.2 var(--mono); letter-spacing:.06em; text-transform:uppercase; }
.project-updated { width:10.5rem; min-height:.82rem; overflow:hidden; color:transparent; border-radius:2px; background:linear-gradient(100deg,color-mix(in srgb,var(--line) 38%,transparent) 20%,color-mix(in srgb,var(--snow) 80%,transparent) 42%,color-mix(in srgb,var(--line) 38%,transparent) 64%) 0 0/240% 100%; font:700 .63rem/1.3 var(--mono); letter-spacing:.04em; animation:skeleton-text 1.25s var(--ease-route) infinite; }.project-updated.is-resolved { width:auto; color:var(--muted); background:none; animation:none; }.project-updated.is-unavailable { visibility:hidden; background:none; animation:none; }
@keyframes skeleton-text { to { background-position:-240% 0; } }
@media (prefers-reduced-motion:reduce) { .project-updated { animation:none; } }
@media (max-width:1000px) { .work-tools { grid-template-columns:1fr; }.work-controls { grid-template-columns:repeat(2,minmax(0,1fr)); }.work-search { grid-column:1/-1; }.work-reset { width:100%!important; }.work-results { grid-column:1; } }
@media (max-width:560px) { .work-controls { grid-template-columns:1fr; }.work-search { grid-column:auto; }.work-results { grid-column:1; } }