/* work filter chips */
.chip{display:flex;gap:8px;align-items:center;min-height:44px;padding:0;border:0;border-bottom:1px solid transparent;background:none;cursor:pointer;color:#9a9ea6;font-family:var(--ztx-mono,'JetBrains Mono'),monospace;font-size:12px;letter-spacing:.08em;transition:color .3s,border-color .3s}
.chip:hover{opacity:.75}
.chip[aria-pressed="true"]{color:var(--ztx-accent,#5ee7e0);border-bottom-color:var(--ztx-accent,#5ee7e0)}

/* work stage */
#work .stage{position:sticky;top:84px;align-self:start;order:0;z-index:3;background:transparent;margin:0 calc(-1 * clamp(20px,5vw,40px));padding:0 clamp(20px,5vw,40px);height:calc(100vh - 124px);min-height:420px;min-width:0;perspective:1600px;perspective-origin:50% 40%}
/* phones/tablets: no stage at all, every row carries its own thumbnail (native lazy images, no JS swapping, no blur layers) */
.wthumb{display:none}
@media (max-width:999.98px){
  #work .stage{display:none!important}
  .wrow{grid-template-columns:116px minmax(0,1fr)!important;column-gap:14px;row-gap:4px;align-items:center;padding:12px 0!important}
  .wrow>span:first-child{display:none}
  .wthumb{display:block;grid-row:span 2;position:relative;width:116px;aspect-ratio:16/10;border-radius:8px;overflow:hidden;background:#16181c linear-gradient(135deg,#1a1d22,#121417);border:1px solid rgba(255,255,255,.08)}
  .wrow>span:nth-child(3){grid-column:2;grid-row:1;align-self:end}
  .wrow>span:last-child{grid-column:2;grid-row:2;align-self:start;font-size:9.5px!important;white-space:normal!important}
  #work{background:rgba(11,12,14,.78)}
  .wrow[hidden]{display:none!important}
}
.wcard{position:absolute;transition:opacity .6s,left .9s cubic-bezier(.2,.8,.2,1),top .9s cubic-bezier(.2,.8,.2,1),width .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
.wcard-in{background:linear-gradient(160deg,rgba(28,31,36,.82),rgba(14,16,19,.86) 60%,rgba(22,25,30,.84));backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.14);box-shadow:0 40px 90px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.12);overflow:hidden;cursor:pointer;transition:border-color .4s;display:block;color:inherit}
.wcard-in:hover{opacity:1}
.wrow{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:14px;align-items:baseline;padding:11px 0;border-bottom:1px solid #1f2125;transition:opacity .4s,color .3s;cursor:pointer}
.wrow:hover{opacity:1}


.hint-touch{display:none}
@media (hover:none),(max-width:999.98px){.hint-mouse{display:none}.hint-touch{display:inline}}
@media (max-width:999.98px){.wrow>span:nth-child(3)>span:last-child{font-size:13px}}